@charset "UTF-8";
body,html{width:100%; line-height:1.5em; color:rgb(102,102,102); font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin:0 auto; }
.wrapper{overflow:hidden;}
a{text-decoration:none;}
.block{display:block;}
.clearfix::before,
.clearfix::after {content:" ";display:table;clear:both;}
.mincho{font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;}

/*header*/
header{ width:90%; max-width:980px; height:100vh; margin:0 auto;}
header #title img{width:50%; max-width:170px; margin-top:20px; margin-left:auto;}
header #welcome{ width:100%;max-width:980px; margin:0 auto;}
header #welcome img{width:70%; max-width:348px; margin:0 auto;}

/*header-backgroud*/
.bgslideshow {position:fixed; left:0; top:0; z-index: -10;  width:100%;}
.bgslideshow img {min-width:1200px;min-height:auto;width:100%;height:auto;position:fixed;top:0;left:0;}


/*navigation*/
#navi{width:100%; max-height:50px; background-color:rgb(245,142,126); margin:0 auto; overflow: hidden;}
#navi .navi_inner {max-width:980px; margin:auto;}
#navi h1{float:left;width:30%;padding:18px 0 0;font-size:200%;color: #fff;}
#navi ul{float:right;width:50%;}
#navi ul li{display: inline-block; float:right; width:25%; line-height:1.6;overflow:hidden;}
#navi ul li a{display:block; width:100%; height:100%; color:rgb(255,255,255); font-size:150%; text-align:center; padding:15px 0; font-weight:bold;}
#navi ul li a:hover{opacity:.7;}

/*main*/
#main{width:100%; height:auto; background-image: -moz-linear-gradient(top,rgb(245,204,204) 0%, rgb(245,242,149) 70%,rgb(191,223,186) 100% );background-image: -ms-linear-gradient(top, rgb(245,204,204) 0%, rgb(245,242,149) 70%,rgb(191,223,186) 100% );
background-image: -o-linear-gradient(top, rgb(245,204,204) 0%, rgb(245,242,149) 70%,rgb(191,223,186) 100% );
background-image: -webkit-linear-gradient(top, rgb(245,204,204) 0%, rgb(245,242,149) 70%,rgb(191,223,186) 100% );background-image: linear-gradient(top, rgb(245,204,204) 0%, rgb(245,242,149) 70%,rgb(191,223,186) 100% ); padding-top:1px;padding-bottom:100px;}
#main .main_inner{ max-width:980px; margin:150px auto 0; padding-bottom: 1px;}
#main .main_inner h2{text-align: center; font-weight: bold; font-size: 300%; margin-bottom: 80px;}
#main .main_inner p{text-align:center; font-size:20px;line-height:1.8; margin-top:30px;}
#main .main_inner #button_inner{ margin:100px auto 0;text-align:center;}
#main .main_inner #button_inner > a{display: block; width:320px; height:auto; margin:0 auto;}
#main .main_inner #button_inner > a img.button{display: block; width: 100%; height:auto;}
#main .main_inner #button_inner > a:hover{opacity: .7;}


/*.button{ position:relative; font-size:30px; color:rgb(255,255,255); font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;letter-spacing:0.2em; font-weight:bold; text-align:center; background-color:rgb(121,209,176); border-radius:4px; width:375px; line-height:85px; transition:none;-webkit-transition:none; box-shadow: 0 3px 0 rgb(14,140,115);text-shadow: 0 1px 1px rgba(0, 0, 0, .3); margin:0 auto;}
.button span{font-size:15px;}
.button:hover {background-color:rgb(130,226,190);box-shadow: 0 3px 0 rgb(35,161,136);}
.button:active {top: 3px;box-shadow: none;}*/

/*扇子背景*/
#sensu{width: 100%; height:450px; background-image:url("../img/bg_sensu.jpg");background-repeat: no-repeat; background-size: cover; }
#sensu2{width: 100%; height:450px; background-image:url("../img/bg_sensu2.jpg");background-repeat: no-repeat; background-size: cover; }

/*プロフィール*/
#prof{ margin:0 auto; padding-bottom: 100px; position:relative;width:100%; height:auto; background:url("../img/bg_washi1.jpg") repeat; background-attachment:fixed;z-index:5; }
#prof .prof_inner{ margin:0 auto;}
#prof .image{ width:100%; max-width:2000px;margin:0 auto; padding-top:80px;}
#prof img.nagiyuki-img{max-width: 330px; height:auto; margin:50px auto 0; border:12px solid rgba(255,255,255,.9); border-style: box-sizing:border-box;}
#prof .text_box{max-width:980px; margin:0 auto; padding-top:10px;}
#prof .text_box h2{text-align: center; font-weight: bold; font-size: 300%; margin-top: 40px; margin-bottom: 30px;}
#prof .text_box h3{text-align: center; font-weight: bold; font-size: 200%; margin-top: 40px; margin-bottom: 10px; }
#prof .text_box ul{margin-top:20px;}
#prof .text_box ul li{ font-size:20px;text-align:left; margin-left:230px; line-height:1.5em;}
#prof .midashi{width:100%; max-width:560px; margin:0 auto; text-align:center; padding-top:80px;}
#prof .midashi2{width:100%; max-width:560px; margin:0 auto; text-align:center; padding-top:15px; padding-bottom:75px;}
.butai ul{ margin:0 auto;}
.butai li{ font-size:20px;text-align:left; margin-left:230px;list-style:none;}
#prof .text_box .aisatsu{max-width:560px; height:auto; box-sizing:content-box; background-color:rgba(255,255,255,0.7); margin:0 auto; padding-bottom:25px;}
#prof .text_box .aisatsu p{ font-size:180%; text-align:center; line-height:3; font-weight: bold; padding: 40px 0;}





/*発表会など*/
.blog{background: #fff1fc; padding-bottom: 100px; }
.blog > .inner{max-width: 600px; margin:auto; padding-top: 1px;}
.blog .contents ul li{font-size: 160%; line-height: 1.6em; color: #000;}
.blog .contents ul li.title{font-size: 240%; font-weight: bold;}
.blog .contents ul.enmoku-wrapper{margin-top: 16px;}
.blog .contents ul.enmoku-wrapper > li{font-weight: bold; padding-top:40px; }
.blog .contents ul.enmoku-wrapper li.midashi{font-weight: bold; font-size: 200%; }
.blog .contents ul.enmoku{width: 94%; margin:10px auto;}
.blog .contents ul.enmoku li{line-height: 2.2em; list-style: disc; }
.blog .contents ul.enmoku li img{display: block; width: 90%; margin-bottom:20px; }
.blog .contents ul.enmoku li img.portrait{width: 60%; }

/*blogエリア*/
.blog .contents{ border-bottom: 1px solid #ccc; padding-bottom: 30px; margin-top: 80px; }
.blog .contents time{ color: #29292d; font-weight: bold; }
.blog .contents h3.title{ font-size: 240%; font-weight: bold; line-height: 1.6em; color: #000; margin-bottom: 10px; }
/*.blog .contents:first-of-type h3.title::before{ content: "新着"; color: #fff; text-align: center; padding: 6px; line-height: 1em; background: #ff8400; font-size: 50%; vertical-align: middle; margin-right: 10px; }*/
.blog .contents p{ line-height: 2em; font-size: 160%;  color: #29292d; width: 100%; }
.blog .contents .bx-wrapper{ max-width: 400px !important; margin: 30px auto 60px; max-height: 300px; }
.blog .contents .photo-area img{ display: block; width: 100%; height: auto; }
.blog .contents .mini-photo-area{ max-width: 400px; margin: 0 auto 60px; }
.blog .contents .mini-photo-area img{ display: block; width: 30%; float: left; margin-right: 3%; }
.bx-wrapper .bx-controls-direction a{ z-index: 99 !important; }

/*教室について*/
#kyoushitu{ margin-top:0; position:relative; width:100%; height:auto; background:url("../img/bg_washi2.jpg") repeat; background-attachment:fixed;}
#kyoushitu h2{text-align: center; font-weight: bold; font-size: 300%; margin-top:40px;margin-bottom: 80px;}
#kyoushitu .kyoushitu_inner{ position:relative; width:100%; margin-top:40px; padding-bottom:0px;overflow:hidden; }
table.table_layout{ width:100%;max-width: 900px;margin: 0 auto;border:solid 1px rgb(100,100,100);border-collapse: separate;border-spacing: 0 10px; margin-top:40px; margin-bottom:62px;}
table.table_layout th{vertical-align: middle;height: 30px;width: 100px;border-right: solid 1px rgb(100,100,100);margin: 0;text-align: center;color:rgb(100,100,100);font-size: 16px;font-weight: bold;}
table.table_layout td.date{padding: 0;margin: 0;height: 53px;width: 100px;border: none;font-size: 16px;line-height: 16px;vertical-align: middle;white-space: nowrap;overflow: hidden;color:rgb(66,66,66); text-align:center;}
table.table_layout td:first-child {padding: 0 0 0 10px;vertical-align: middle;}
table.table_layout td.bar {height: 1px;width: 100%;border-top: solid 1px rgb(100,100,100);}
tr ul{ margin-left:170px;}
tr ul li{ line-height:1.5em; list-style-type:square; text-align:left;}

/*googlemap*/
#map-wrapper{background:url("../img/bg_keikoba.jpg") no-repeat;background-size:cover; padding:1px 0;}
.map_box{width:100%;margin:0 auto; margin-top:10px; height: auto; }
.map_box .map_inner{ width:100%;max-width:900px; margin:50px auto; background:#fff;padding: 1px 0;}
.map_box .map_inner .map_box_inner{float:left; width:500px;}
.map_box .map_inner .adress_box{ float:left;  width:300px; padding-left:30px; font-size:15px; font-weight:bold; letter-spacing:0.1em;}
.map_box .map_inner .map_title{ font-size:200%; font-weight:bold; line-height:1.3em; color:rgb(10,10,10); margin-top:100px; margin-bottom: 30px;}
.map_box .map_inner .adress_box p{font-size:120%; line-height: 1.2;}

/*体験教室*/
#taiken{margin:0 auto; background:url("../img/backgimage_kyoushitsu.jpg") repeat; overflow:hidden;}
#taiken h2{text-align: center; font-weight: bold; font-size: 300%; margin-top: 30px; margin-bottom: 30px;}
#taiken .taiken_inner{max-width:980px; height:auto;margin:0 auto;background-color:rgba(255,255,255,0.8); padding-right:10px;margin-top:100px; margin-bottom:60px; padding-bottom:70px;}
.sub_title_taiken{width:65%; max-width:735px; margin:0 auto; text-align:center; padding-top:70px;}
#taiken .taiken_inner p{text-align:left; font-size:180%; float:left; width: 66%; line-height: 2;}
#taiken .taiken_inner .photo{float:right; width:30%;}
.taiken_box{width:80%; max-width:900px; margin:0 auto; margin-top:80px; padding-left:90px;}
/* 吹き出し*/
.bubble_box{width:980px; margin-top:80px; margin:0 auto;}
.bubble_box img{width:70%; max-width:70px; margin:40px 50px -20px 200px;}
.bubble {max-width:430px;display:inline-block;position: relative;padding:0.2em;border-radius:5px;background:rgb(190,224,200);}
.bubble::after {position: absolute;content: " ";height: 0;width: 0;}
.bubble-left::after {right: 100%;top: 50%;border:8px solid transparent;border-right:40px solid rgb(190,224,200);}

/*お問い合わせ*/
#mail{width:100%;background:url("../img/bg_washi3.jpg") repeat; margin:0 auto;padding-bottom: 1px;}
#mail p{font-size:140%;line-height: 1.5;padding:20px 0;}
#formWrap {width:100%;max-width:700px;margin:0 auto;color:#555;font-size:110%;line-height: 1.4;}
#formWrap p{text-align:center;}
table.formTable{width:100%;margin:0 auto; border-collapse:collapse;}
table.formTable td,
table.formTable th{border:1px solid #ccc; padding:10px; background-color:rgba(255,255,255,0.8); font-size: 120%;}
table.formTable td{width: 75%;}
table.formTable th{font-weight:normal;background:#efefef;text-align:left;}
table.formTable td input,
table.formTable td textarea{margin-left:10px;}
table.formTable td input[type="text"]{width: 80%;}
table.formTable td textarea{width:90%;}
table.formTable td span.notes{display: inline-block; margin: 10px; font-size: 90%; color: #e21251; }

/*フッター*/
footer{ width:100%; height:auto; background-color:rgb(232,230,222); margin:0; bottom:0;}
footer .footer_inner{width:100%; max-width:1200px; position: relative; margin: auto;}
footer p{text-align: right; position: absolute; right: 5px; top: 5px;}
footer .banner-area{width: 100%; margin: 20px auto;}
footer .banner-area a{display: block; width: 300px; height: auto; margin: 0 auto;}
footer .banner-area img.banner{display: block; width: 100%; height: auto;}

/*サブタイトル*/
.sub_title{width:50%; max-width:735px; margin:0 auto; text-align:center; padding-top:80px;}

/*トップへもどる*/
#pageTop {position: fixed;bottom: 50px;right: 50px;}
#pageTop a {display: block;z-index: 999999;padding: 8px 0 0 8px;width: 35px;height: 35px;text-align: center;}
#pageTop a:hover {opacity: 0.7;}

section.final {background: url(../img/blog/bg_blog.jpg) no-repeat; background-size: cover; background-position: center; padding: 1px 0; position: relative; z-index: 1;}
section.final .inner{ max-width: 1100px; background: rgba(255,255,255,.7); margin:100px auto; padding: 40px; box-sizing: border-box; position: relative;}
section.final .inner p.t-date{ text-align: center; font-size: 160%; font-weight: bold; color: #000;line-height: 1.6em; }
section.final .inner p.t-date > span{ display: inline-block; color: red; font-size: 90%; }
section.final .inner h3.title{ text-align: center; font-size: 240%; margin: 0 auto 5px; font-weight: bold; color: #000; line-height: 1.6em; }
section.final .inner .mini-photo-area img{ display: block; width: 12%; float: left; margin-right: .5%; margin-bottom: 4px; border: 2px solid #fff; box-sizing: border-box; }
section.final .inner .mini-photo-area img:hover{ opacity: .7; }
section.final p:last-of-type{ text-align: center; font-size: 140%; }
section.final p span.note{ display:inline-block; color: #ff1473; margin: 0 auto 10px; font-weight: bold; background: #fff; padding: 10px; border-radius: 10px; }
section.final.reiwa1 {background: url(../img/blog2019/bg_blog.jpg); background-size: cover;  }
section.final.reiwa2 {background: url(../img/2020/bg.jpg); background-size: cover;  }
section.final.reiwa3 {background: url(../img/osarai/44-bg.jpg); background-size: cover; background-position: center;}
section.final.reiwa4 {background: url(../img/2022/bg2022.jpg); background-size: cover; background-position: center;}
section.final.reiwa5 {background: url(../img/2023/bg2023.jpg); background-size: cover; background-position: center;}
section.final.reiwa2 div.comment,
section.final.reiwa3 div.comment{
	max-width: 660px;
	margin: 1em auto;
	padding: 1em;
	box-sizing: border-box;
	font-size: 16px;
	color: #323635;
	line-height: 1.8;
	background: rgba(255,255,255,.8);
	border: 2px solid rgb(244,244,244);

}

section.final.reiwa3 div.letter h3.headline img{
	display: block;
	width: 100%;
	height: auto;
	
}

section.final.reiwa3 div.letter{
	width: 100%;
	max-width: 860px;
	margin: 3em auto;
	background: url(../img/bg_letter.jpg);
	background-size: cover;
	padding: 2.2em;
}

section.final.reiwa3 div.letter p{
	text-align: left;
	color: #5c5c5c;
	font-weight: bold;
	line-height: 2.4;
	font-size: 170%;

}

section.final.reiwa3 div.letter p.name{
	text-align: right;
	font-size: 140%;
}

section.final.reiwa3 div.letter p span{
	border-bottom: dotted 2px #a2a2a2;
}

@media screen and (max-width:750px){
h2{font-size:18px;padding-top:60px; padding-bottom:40px;}
h3{text-align:left; margin-left:20px;}
/*サブタイトル*/
.sub_title{width:100%;padding-top:40px;}
/*header-backgroud*/
.bgslideshow img {left:50%;margin-left:-600px;height:100%; width:auto;}
/*header*/
header #title img{width:40%; margin-left:210px;}
header #welcome{ width:100%;margin-top:20px;}
header #welcome img{width:70%;}
/*main*/
#main{padding-bottom:0;}
#main .main_inner{ margin-bottom:50px;}
#main .main_inner p{font-size:16px;}
#button_inner{ margin-top:70px;text-align:center;}
.button{width:70%;}
/*プロフィール*/
#prof{ padding-bottom:450px;}
#prof .prof_inner{ margin:0 auto;}
#prof .image{padding-top:40px;}
#prof .text_box{padding-top:20px;}
#prof .text_box h2{font-size:20px;}
#prof .text_box ul{margin-top:35px;}
#prof .text_box ul li{ font-size:16px;margin:0 auto;}
#prof .midashi{padding-top:40px; padding-bottom:20px;}
#prof .midashi2{padding-bottom:20px;}
.aisatsu{ margin:0 auto;padding:30px;}
.aisatsu p{ font-size:140%;line-height:2.5;}
/*教室について*/
#kyoushitu{width:100%; max-width:2000px;margin:0 auto;  padding-bottom:1150px; }
#kyoushitu .kyoushitu_inner{ width:100%;max-width:750px;}
#kyoushitu h2{ font-size:20px;} 
table.table_layout{max-width:740px;border-spacing: 0 10px; margin-top:40px; margin-bottom:62px;}
table.table_layout td.date{font-size: 14px;}
table.table_layout td:first-child {padding: 0 0 0 10px;vertical-align: middle;}
table.table_layout td.bar {height: 1px;width: 100%;border-top: solid 1px rgb(255,255,255);}

tr ul{ margin:0 auto;}
tr ul li{ line-height:1.5em; list-style-type:square; text-align:left;}


/*体験教室*/
.sub_title_taiken{width:100%;padding-top:40px;}
#taiken h2{ font-size:18px;}
#taiken .taiken_inner .photo{width:70%;}
#taiken .taiken_inner{ padding:0;margin-top:215px; margin-bottom:60px; padding-bottom:70px;}
#taiken .taiken_inner p{ font-size:14px;float:none; clear:both;}
.taiken_box{margin-top:40px; padding:0;}

#taiken{margin:0 auto; background:url("../img/backgimage_kyoushitsu.jpg") repeat; overflow:hidden;}

}

@media screen and (min-width:480px){
	.bgslideshow-wrapper{position: relative;}
	.bgslideshow-wrapper .bgslideshow{display: flex; position: fixed;z-index: 51;width: auto; height: 100vh;/*  height: 100%; */ top: 0;left: 0;}
	.bgslideshow-wrapper .bgslideshow img{width:100%; height:100%;}
}