@charset "utf-8";
/* CSS Document */

*/h1,h2,h3,h4,h5,h6,p,blockquote,em,img,q,small,strong,var,b,i,dl,dt,dd,ol,ul,li,form,label,legend,caption,article{margin:0; border:0;padding:0; outline:0; vertical-align:baseline; background:transparent}

/* Font設定 */
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 100;}
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 200;}
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 300;}
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 400;}
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Bold"); font-weight: bold;}
@font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 100;}
@font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 200;}
html { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;}
@media all and (-ms-high-contrast: none) { html { font-family: Verdana, Meiryo, sans-serif; }}
@media all and (-ms-high-contrast: active) { html { font-family: Verdana, Meiryo, sans-serif; }}

/* body */
body { margin: 0 auto; background-image: url(../images/bg_01.png); background-repeat: repeat;}

/* header */
header {width: 100%; margin: 0; padding: 0; background-color: white;}
header #wrap { width: 900px; height: 80px; display: flex; margin: 0 auto; padding: 0;}
header .logo{ width: 30%; padding-top: 15px; display: inherit; }
header .logo img{ width: 286px; }
header .logo .header_logo2 { padding: 0 0 10px 20px; width: 250px; }

header .btn_erae { width: 70%; padding-top: 15px; text-align: right;}

/* header_navi */
header #navi {width: 100%; height: 50px; margin: 0 auto; background: linear-gradient( #000000, #424242 ); border-bottom: solid 5px #000000;}
header ul {width: 1000px; margin: 0 auto; padding: 14px 0 0 0; list-style: none; text-align: center;}
header ul li {margin: 0; padding: 0 50px; display: inline;}
header ul li a { font-size: 16px; font-weight: bolder; color: white; text-decoration: none; text-shadow: 2px 2px 5px #000;}

/* header_eye_cath */
header #eye_cath {width: 100%; margin: 0 auto; background-color: #ff3600; text-align: center; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.4);}
header #eye_cath img{ max-width: 800px; margin: 10px 0 0; min-width: 90%;}
header #eye_cath h1 { margin: 0 auto; padding: 30px 0 5px; font-size: 37px; color: #ffff00; font-weight: bolder;}
header #eye_cath h2 { margin: 0; padding: 0; font-size: 90px; color: #fff; font-weight: bolder; line-height: 1;}
header #eye_cath h3 { margin: 0; padding: 0; font-size: 61px; color: #fff; font-weight: bolder; line-height: 1.15;}
header #eye_cath h4 { margin: 0; padding: 0; font-size: 58px; color: #fff; font-weight: bolder; line-height: 1;}
header #eye_cath h5 { margin: 0; padding: 0; font-size: 24px; color: #ffff00; font-weight: bolder; line-height: 1.2;}
header #eye_cath h6 { margin: 0; padding: 0; font-size: 20px; color: #ffff00; font-weight: bolder; line-height: 1.6;}
header #eye_cath small { margin: 0; padding: 0; font-size: 38px; color: #fff; font-weight: bolder; line-height: 1.2;}
header #eye_cath ul {width: 900px; margin: 0 auto; padding: 15px 0 30px 0; list-style: none; text-align: center; display: flex;}
header #eye_cath ul li:first-child { width: 50%; margin: 0; padding: 0; display: block;}
header #eye_cath ul li:last-child { width: 42.5%; padding: 0; display: block;}

/* starburst */
header #starburst { display: block; width: 15.4em; height: 15.4em; line-height: 1.8em; background: #000; -webkit-transform: rotate(-70deg); -moz-transform: rotate(-65deg); rotation: -45deg; position: relative; margin: 40px auto 60px; text-align: center; text-decoration: none; color: #FFF; font-weight: bold; -moz-transition: -moz-transform 0.3s ease; -webkit-transition: -webkit-transform 0.3s ease;}
header #starburst span { display: block; width: 15.4em; height: 15.4em; background: #000; -webkit-transform: rotate(22.5deg); -moz-transform: rotate(22.5deg); rotation: 22.5deg;}
header #starburst h1 { margin: 0 auto; padding: 63px 0 0; font-size: 37px; color: #ff3600; font-weight: bolder; line-height: 1;}
header #starburst h2 { margin: 0 auto; padding: 20px 0 0; font-size: 80px; color: #ffff00; font-weight: bolder;}

/* main */
main .white { color: #fff;}
main .orange { color: #ff3600;}
main .red { color: #ff0000;}
main .yellow { color: #ffff00;}
main .blue { color: #0028bd;}
main #xl { font-size: 48px;}
main #l { font-size: 32px; margin: 7px 0 10px; display: block;}
main .under_line { background:linear-gradient(transparent 70%, #fffc9d 0%);}
main .under_line2 { padding: 1px; background:linear-gradient(transparent 0%, #ffff00 0%);}
main .under_line_dot { padding: 0 0 8px 0; background-image: linear-gradient(to right, #e2bbac, #e2bbac 3px, transparent 3px, transparent 3px); background-size: 7px 3px; background-repeat: repeat-x; background-position: left bottom;}

/* main_attend */
main #attend {width: 100%; margin: 0 auto; padding: 10px 0 40px 0; text-align: left;}
main #attend h1 { width: 785px; margin: 20px auto 0; font-size: 22px; font-weight: bold;}
main #attend h2 { width: 785px; margin: 15px auto 20px; font-size: 16px; line-height: 1.5; font-weight: bold;}
main #attend .box { width: 775px; position: relative; margin: 3em auto 1.5em; padding: 4px 4px 8px; border: solid 1px #ff3600; background-color: white;}
main #attend .box { 
	background-image: url("../images/box_back2.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right bottom}
main #attend .box-title { position: absolute; display: inline-block; top: -20px; left: 10px; padding: 10px 30px; line-height: 1; font-size: 20px; background: #ff3600; color: #fff; font-weight: bold; border: solid 1px #ff3600; border-radius: 50px;}
main #attend .box-text { width: 94%; margin: 4% 3% 1%; text-align: left; font-size: 14px; font-weight: bold; line-height: 1.6;}
main #attend .box2 { width: 775px; position: relative; margin: 2.5em auto 1em; padding: 45px 4px 15px; border: solid 1px #ff3600; background-color: white; text-align: center;}
main #attend .box-title2 { position: absolute; display: inline-block; top: -20px; left: 10px; padding: 10px 30px; line-height: 1; font-size: 18px; background: #ff3600; color: #fff; font-weight: bold; border: solid 1px #ff3600; border-radius: 50px;}
main #attend h4 { width: 785px; margin: 0 auto; padding: 0; font-size: 24px; font-weight: bold; text-align: center;}

/* main_erea1 */
main #erea1 {width: 100%; margin: 0 auto; padding: 20px 0 25px; background-color: #000; text-align: left;}
main .erea1_film {width: 100%; height: 23px; margin: 0; padding: 0; background-image: url("../images/bg_02.png"); background-repeat: repeat;}
main #erea1 h1 { width: 785px; margin: 0 auto 18px; padding: 0; font-size: 22px; font-weight: bold;}
main #erea1 h2 { width: 745px; margin: 0 auto; padding: 10px 20px; font-size: 18px; font-weight: bold; background-color: #ff3600; border-radius: 5px 5px 0 0;}
main #erea1 h3 { width: 743px; margin: 0 auto 20px; padding: 12px 20px 16px; font-size: 14px; line-height: 1.8; font-weight: bold; background-color: #fff; border-radius: 0 0 5px 5px; border: solid 1px #ff3600;}
main #erea1 h4 { width: 743px; margin: 0 auto 20px; padding: 10px 20px 8px; font-size: 18px; line-height: 1.2; font-weight: bold; background-color: #fff; border-radius: 0 0 5px 5px; border: solid 1px #ff3600; text-align: center;}
main #erea1 h5 { width: 743px; margin: 0 auto 10px; padding: 10px 20px 8px; font-size: 18px; line-height: 1.2; font-weight: bold; background-color: #fff; border-radius: 0 0 5px 5px; border: solid 1px #ff3600; text-align: center;}
main #erea1 h6 { width: 745px; margin: 0 auto 10px; padding: 8px 20px 8px; font-size: 22px; color: #ff0000; line-height: 1.8; font-weight: bold; text-align: center;}
main #erea1 .box {background-image: url("../images/price_back2.png"); background-repeat: no-repeat; background-size: contain; background-position: center}

/* main_erea2 */
main #erea2 {width: 100%; margin: 0 auto; padding: 45px 0 0; text-align: center;}
main #erea2 h1 { width: 785px; margin: 0 auto 15px; padding: 0; font-size: 24px; font-weight: bold; text-align: left;}
main #erea2 h2 { width: 745px; margin: 0 auto; padding: 10px 20px; font-size: 18px; font-weight: bold; background-color: #ff3600; border-radius: 5px 5px 0 0; text-align: left;}
main #erea2 h3 { width: 743px; margin: 0 auto 20px; padding: 12px 20px 16px; font-size: 14px; line-height: 1.8; font-weight: bold; background-color: #fff; border-radius: 0 0 5px 5px; border: solid 1px #ff3600; text-align: left;}
main #erea2 h4 { width: 785px; margin: 0 auto; padding: 0; font-size: 24px; font-weight: bold; text-align: center;}
main #erea2 .box { width: 775px; position: relative; margin: 2.5em auto 1em; padding: 45px 4px 15px; border: solid 1px #ff3600; background-color: white;}
main #erea2 .box-title { position: absolute; display: inline-block; top: -20px; left: 10px; padding: 10px 30px; line-height: 1; font-size: 18px; background: #ff3600; color: #fff; font-weight: bold; border: solid 1px #ff3600; border-radius: 50px;}
main #erea2 .box-text { width: 94%; margin: 4% 3% 1%; text-align: left; font-size: 16px; font-weight: bold; line-height: 1.8;}

/* FAQ */
main #area2_wrap { width: 787px; margin: 0 auto; padding: 0 0 1%; text-align: left;}
main #erea2 .atnd_box { width: 745px; margin: 20px auto 0px; padding: 20px; text-align: left; font-size: 12px; color: #ff6767; font-weight: bold; background-color: #fff4f4; display: block; border: solid 1px #ffbcbc;}
/* FAQ タブ内展開メニュー*/
main #hidden_box { width: 100%; margin: 0 auto; padding: 0; display: block;}
/* FAQ ボタン装飾*/
main label { width: 96%; margin: 8px 0 0; padding: 1% 2%; color: #fff; font-size: 16px; font-weight: bold; background: #ff3300; display: block; border: solid 1px #ff3300; border-radius: 20px;}
/* FAQ ボタンホバー時*/
main label:hover {color: #ff3300; background: #fff; border: solid 1px #ff3300;}
main input { display: none;}
main input:checked ~ .hidden_show { width: 100%; padding: 5px 0; height: auto; opacity: 1;}
main .hidden_show { height: 0; padding: 0; overflow: hidden; opacity: 0;}
main .hidden_text { width: 96%; margin: 0; padding: 1.5% 2%; background-color: #FFFDEA; font-size: 14px; line-height: 1.6; font-weight: bold; display: block; border-radius: 20px;}

/* 小見出し */
main #erea2 .box2 { width: 752px; position: relative; margin: 3em auto 0; padding: 1.5em 1em; border: solid 1px #fff; background-color: white; border: solid 1px #ff3300; box-shadow: 4px 4px rgba(226, 196, 172, 0.4);}
main #erea2 .box2_end { width: 752px; position: relative; margin: 3em auto 2.5em; padding: 0.5em 1em; border: solid 1px #fff; background-color: white; border: solid 1px #ff3300; box-shadow: 4px 4px rgba(226, 196, 172, 0.4);}
main #erea2 .box2-title { position: absolute; display: inline-block; top: -20px; left: 10px; padding: 10px 30px; line-height: 1; font-size: 18px; background: #ff3300; color: #fff; font-weight: bold; border: solid 1px #ff3300; border-radius: 50px;}
main #erea2 ul {width: 94%; margin: 3% auto 8px; padding: 0; list-style: none; display: flex;}
main #erea2 ul li:first-child {width: 38%; margin: 0; padding: 0; text-align: left;}
main #erea2 ul li:last-child {width: 62%; margin: 0; padding: 0; text-align: left; font-size: 16px; line-height: 1.6; font-weight: bold;}
main #erea2 .attend {width: 92%; margin: 2% auto 0.5%; padding: 1.5% 2%; background-color: #4A6E8A; color: white; font-weight: bold; display: block;}
main #erea2 h5 { width: 96%; margin: 0 auto 2%; padding: 1.5% 2% 0.7%; font-size: 18px; color: #ff3300; font-weight: bolder; background-color: #FFFBD2; display: block;}
main #erea2 h6 { width: 100%; margin: 2% auto 0; padding: 0; font-size: 14px;display: block;}

/* main_erea3 */
main #erea3 {width: 100%; margin: 0 auto; padding: 20px 0 25px; background-color: #000; text-align: left;}
main .erea3_film {width: 100%; height: 23px; margin: 0; padding: 0; background-image: url("../images/bg_02.png"); background-repeat: repeat;}
main #erea3 h1 { width: 785px; margin: 0 auto 18px; padding: 0; font-size: 22px; font-weight: bold;}
main #erea3 h2 { width: 745px; margin: 0 auto; padding: 10px 20px; font-size: 18px; font-weight: bold; background-color: #ff3600; border-radius: 5px 5px 0 0;}
main #erea3 h3 { width: 743px; margin: 0 auto 20px; padding: 12px 20px 16px; font-size: 14px; line-height: 1.8; font-weight: bold; background-color: #fff; border-radius: 0 0 5px 5px; border: solid 1px #ff3600;}
main #erea3 h4 { width: 96%; margin: 0 auto 2%; padding: 1.5% 2% 0.7%; font-size: 18px; color: #ff3300; font-weight: bolder; background-color: #FFFBD2; display: block;}
main #erea3 h5 { width: 100%; margin: 2% auto 0; padding: 0; font-size: 14px;display: block;}
main #erea3 ul {width: 100%; margin: 1% 0 0; padding: 0; list-style: none; display: flex;}
main #erea3 ul li:first-child {width: 38%; margin: 0; padding: 0; text-align: left;}
main #erea3 ul li:last-child {width: 62%; margin: 0; padding: 0; text-align: left; font-size: 16px; line-height: 1.6; font-weight: bold;}
main #erea3 .attend {width: 96%; margin: 2% auto 0.5%; padding: 1.5% 2%; background-color: #4A6E8A; color: white; font-weight: bold; display: block;}

/* footer 設定 */
footer {width: 100%; text-align: center; border-top: solid 10px #686868; padding: 28px 0 5px 0; background-color: #333333; color: white;}
footer .footer_logo { width: 300px; }
footer .footer_logo2 { padding: 0 28px; width: 250px; }
footer a { font-size: 12px; display: inline; margin-left: 10px; text-decoration: none; color: #FFF;}
footer .copy { font-size: 11px; margin-bottom: 20px;}
footer .copy a{ text-decoration: none; color: #FFF;}

/* box_img */
main .box_img { width: 308px; margin: 0;}
main .box_img2 { width: 680px;}
main .box_img3 { width: 250px; margin: 0; padding: 0; display: block;}

/* 申込ボタン */
#btn { width: 100%; text-align: center; margin: 20px 0 5px; display: block;}
.btn-large { display: inline-block; padding: 0.6em 1.5em; text-decoration: none; border-radius: 50px; font-size: 22px; font-weight: bold; line-height: 0; color: #ff3600; border: solid 4px #ff3600; background-color: white;}
.btn-large:hover { display: inline-block; padding: 0.6em 1.5em; text-decoration: none; border-radius: 50px; font-size: 22px; font-weight: bold; line-height: 0; color: #ff3600; background-color: #FFF500; border: solid 4px #FFF500; }
.btn-small { display: inline-block; padding: 0.6em 1.5em; text-decoration: none; border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 0; color: #ff3600; border: solid 3px #ff3600; }
.btn-small:hover { display: inline-block; padding: 0.6em 1.5em; text-decoration: none; border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 0; color: #ff3600; background-color: #FFF500; border: solid 3px #FFF500; }

/* 上に上がる */
#page_top{ width: 60px; height: 30px; position: fixed; right: 0; bottom: 0; opacity: 0.6;}
#page_top a{ width: 60px; height: 60px;text-decoration: none;}
#page_top a::before{ font-family: 'FontAwesome'; font-weight: 900; content: '\f0aa'; font-size: 60px; color: #ff3300;}

/* 20220207追加 */
#free_guide_wrap { width: 775px; position: relative; margin: 2.5em auto 1em; padding: 5px 4px 15px; border: solid 1px #ff3600; background-color: white;}
.free_guide_title { position: absolute; display: inline-block; top: -20px; left: 10px; padding: 10px 30px; line-height: 1; font-size: 18px; background: #ff3600; color: #fff; font-weight: bold; border: solid 1px #ff3600; border-radius: 50px;}
.free_guide_text { width: 93%; margin: 4% 1.5% 1%; padding: 1.5% 2%; text-align: left; font-size: 14px; font-weight: normal; line-height: 1.5; background-color: #FFFBD4;}
.free_guide_title2 { width: 96%; margin: 3.5% 2% 1.5%; line-height: 1; font-size: 16px; color: #ff3600; font-weight: bold; text-decoration: underline; }
.free_guide_text2 { width: 96%; margin: 1% 2%; text-align: left; font-size: 13px; font-weight: normal; line-height: 1.3; }
.free_guide_img { width: 88%; margin: 2% auto; display: block;}

/* 202212追加 */
#ext_202212 {width: 100%; margin: 0 auto 20px; padding: 10px 0; text-align: center;}
#ext_202212 .sec_wrap { width: 815px; margin: 40px auto 10px; padding: 0;}
#ext_202212 .sec_title { margin: 0 auto; padding: 1.2% 3.5%; background-color: #ff580f; border-radius: 30px; font-size: 20px; font-weight: bolder; color: #FFFFFF; white-space: nowrap; box-shadow: 3px 3px rgba(241, 84, 22, 0.4);}
#ext_202212 .sec_text { margin: 25px auto 18px; padding: 0; font-size: 16px; font-weight: bolder; color: #400000;}
#ext_202212 .sec_img { width: 90%; margin: 0 auto 7px; display: block;}
#ext_202212 ul{ width: 860px; margin: 0 auto; padding: 0; list-style: none; flex-wrap: wrap;  }
#ext_202212 ul li:first-child { width: 30%; height: auto; display: inline-block;}
#ext_202212 ul li:nth-child(2) { width: 30%; height: auto; display: inline-block;}
#ext_202212 ul li:nth-child(3) { width: 30%; height: auto; display: inline-block;}
#ext_202212 ul li:nth-child(4) { width: 30%; height: auto; margin: 1% auto; display: inline-block;}
#ext_202212 ul li { border: solid 1px #ff3600; background-color: #FFFFFF; vertical-align: top;}
#ext_202212 ul li:last-child { width: 30%; height: auto; margin: 1% auto; display: inline-block;}
#ext_202212 .sec_li_title { width: 95%; margin: 0; padding: 2% 2.5%; background-color: #ff3600; font-size: 16px; font-weight: bolder; color: #FFFFFF;}
#ext_202212 .sec_li_text { width: 95%; margin: 0; padding: 4% 2.5%; font-size: 14px; font-weight: bolder; line-height: 1.4; color: #400000;}
.bottom {
}
.background-image {
}
.background-position {
}
