@charset "utf-8";
/* CSS Document */
/*font*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@600;700;900&display=swap');

/*----------------------------------------------------------------------------
 ***                                                                Container
----------------------------------------------------------------------------*/
body {
}
#wrap {
}

.pcNone{ display:none;}
.spNone{ display:block;}
.dispFlex{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}

/*----------------------------------------------------------------------------
 ***                                                                  Header
----------------------------------------------------------------------------*/
#headerArea {}
#headerAreaLogo{}
#headerAreaLogo h1{}

#headerArea #headerLink{
    width: 248px;
}

.appTop {
	font-size: 35%;
    float: right;
    padding-left: 1em;
    padding-top: 1.6em;
	font-weight: bold;
	color: black;
	font-family: auto;
}
/*.appTop a:link{
	font-weight: bold;
	color: black;
}
*/
/*----------------------------------------------------------------------------
 ***                                                              contentsArea
----------------------------------------------------------------------------*/
#contentsArea { width:950px; margin:0 auto;}
#contentsAreaInner {}


/*----------------------------------------------------------------------------
 ***                                                                  footer
----------------------------------------------------------------------------*/
#bottomArea{}
#bottomAreaInner{}
#bottomAreaLogo{}
#bottomAreaLink{}

#footerCopyright{ margin-top:25px;}



/*----------------------------------------------------------------------------
 ***                                                                frontPage
----------------------------------------------------------------------------*/
/*font*/
.frontPage body, .frontPage h1, .frontPage h2, .frontPage h3, .frontPage td, .frontPage th, .frontPage p, .frontPage li{
	font-family: YuMincho, 'Yu Mincho', serif;
}

.contentsInner{ width: 950px; margin: 0 auto;}
.notosans{ font-family: 'Noto Sans JP', sans-serif;}
.hiragino-serif {font-family:'Hiragino Mincho Pro',serif;}
.bg_main{background-image: url("../images/bg_main.png"); background-position: center;}
.bg{
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position:relative;width: 100vw;
	position: relative;left: 50%;
	transform: translateX(-50%);
	position: relative;
}
.bg:before{
	content: "";
	position: absolute;
	top: 1%; 
	width: 100%;
	height: 98%; 
	background: rgb(255,255,255);
	/*background: linear-gradient(linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 24%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 60%, rgba(255,255,255,0.8) 76%, rgba(255,255,255,0) 100%));*/
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 20%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.8) 80%,rgba(255,255,255,0) 100%);
	z-index: -1;
}
.bg_white{position: relative;}
.bg_white:before{
	content: "";
	position: absolute;
	top: 0; 
	width: 100%;
	height: 100%; 
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 20%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 60%, rgba(255,255,255,0.8) 80%,rgba(255,255,255,0) 100%);
	z-index: -1;
}

.bg04.bg_white:before{top: 5%; height: 45%;}
.bg02{background-image: url("../images/bg02.jpg");}
.bg03{background-image: url("../images/bg03.jpg");}
.bg04{background-image: url("../images/bg04.jpg");}

/*wrap*/
.frontPage img{width: 220px; height: auto;}
.btn{text-align: center;}
.btn img{width: 290px;}
.btn a:hover{opacity: 0.7;}
.frontPage h2{text-align: center; font-size: 2.4em; color: #42210B; margin-bottom: 0.6em; font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro'; font-weight: 900}
.borderYellow{position: relative; z-index: 0;background: linear-gradient(transparent 70%, #FFFF00 70%);}
/*.borderYellow:before{position: absolute; content: ""; border-bottom: solid 0.5em yellow; width: 100%; bottom: 0; z-index: -1;}*/
.colorRed{color: red;font-size: 105%;}
.contents{padding: 60px 0;}
.contents.mainSec {padding-top: 20px;}
.contents02{padding: 75px 0;}

#headerArea{margin: 0 auto;border: none; background: #F1EDE6; padding: 10px 0;border-top:solid 20px #42210b;}
#headerAreaInner{position: relative;}
#headerTitle{width: 100%;justify-content: space-between;}
#headerArea .ttlTxt{
    font-size: 11px;
    color: #fff;
    font-weight: normal;
    position: absolute;
    top: -28px;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}
#headerArea .ttlSub{
    position: absolute;
    top: -28px;
    right: 0;
    color: #fff;
    font-size: 11px;
    text-align: right;
    width: 400px;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}
/*corp系ページヘッダー*/
#headerArea.corpPage{background: #fff; padding: 10px 0;margin-bottom: 1em; border-top:solid 20px #858585; border-bottom: 3px solid #e91e63;}


.frontPage .topSec{	
	height: 625px;
	background: #F1EDE6;
	width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%); 
	padding: 0;
}
.frontPage .topSec:before{
	background-image: url("../images/bg_top.png");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat; 
	position: absolute;
	content: "";
	height: 72%; 
	width: 100%;
}
.frontPage .topSec:after{background: #F1EDE6; position: absolute; content: "";height: 185px; width:100% ;bottom: 0;}
.frontPage .topSec .contentsInner{padding-top: 70px;position: relative;}
.frontPage .topSec .contentsInner:before{
	content: "";
	width: 0;height: 0;
	border-style: solid;
	border-width: 40px 40px 0 40px;
	border-color: #F1EDE6 transparent transparent transparent;
	position: absolute;
	bottom: -60px;
	left: 0; 
	right: 0;
	margin: auto;
}
.frontPage .topBox{	position: relative; z-index: 1;}
.frontPage .topBox .btn{margin: 20px auto;}
.frontPage .topBox p{text-align: center; color: #603813}
.frontPage .topBox .txt_top{font-size: 1.4em; font-weight: 600;}
.frontPage .topBox .txt_top .borderYellow{font-size: 1.2em; font-weight: 600; margin-left: 3em; line-height: 2em;}
.frontPage .topBox .txt_top img{width: 115px; margin-left: 0.5em; margin-bottom: 0.5em;}
.frontPage .topBox .topBox_topic{justify-content: center;}
.frontPage .topBox .topBox_topic li{ margin: 0 8px; background: #F1EDE6; border: solid 6px #603813; text-align: center; width: 125px; height: 125px; display: flex; justify-content: center; align-items: center; flex-direction: column; color: #603813; margin-top: -5px;}
.frontPage .topBox .topBox_topic li p{margin: 0 auto; font-size: 0.9em;line-height: 1.2em;font-weight: 500;}
.frontPage .topBox .topBox_topic li .ttl{margin: 1em auto 0.6em;}
.frontPage .topBox .topBox_topic li span{font-size: 1.5em; font-weight: 900; font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro'; line-height: 1.2em;}
.frontPage .ttl_top01 img{width: 465px}
.frontPage .ttl_top02{position: absolute; top: -78px; left: -30px;}
.frontPage .ttl_top03{position: absolute; top: 40px; right: -15px;}
.frontPage .ttl_top03 img{width: 250px;}


/*--アプリ留学でデキること--*/
.frontPage .mainSec{}
.frontPage .mainSec .dekirukoto{background-image: url("../images/img_main00.png"); width: 90%; height: 290px;background-size: contain;background-position: center;background-repeat: no-repeat;margin: 0 auto 2em;}
.frontPage .mainSec ul{padding: 4.8em 0 0em 6.8em;}
.frontPage .mainSec li{font-size: 1.5em; font-weight: 700;font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro'; margin-bottom: 0.6em;}
.frontPage .mainSec li:before{background-image: url("../images/img_check01.png"); background-repeat: no-repeat;content: "";display: inline-block;width: 1.5em;height: 1.5em;background-size: contain; padding-right: 0.7em;vertical-align: bottom;}
.frontPage .mainSec li:nth-child(2):before{background-image: url("../images/img_check02.png");}
.frontPage .mainSec li:nth-child(3):before{background-image: url("../images/img_check03.png");}


/*--英語漬けの5ステップ--*/
.frontPage .stepSec .stepBox{margin: 20px auto; position: relative;}
.frontPage .stepSec .stepBox:before{content: ""; position: absolute; border: dashed 1px #42210B; height: 105%; left: 13%; z-index: -1;}
.frontPage .stepSec .stepBox05:before{ border:none;}
.frontPage .stepSec .ttl_step{width: 80%; margin: 0 auto;background-image: url("../images/ttl_step.png");background-size: 100%;padding: 0.3em 0.6em 0.6em;}
.frontPage .stepSec .ttl_step img{width: 13%;margin-right: 1%;padding-right: 2%;border-right: solid 1px #fff;}
.frontPage .stepSec .ttl_step span{padding-top: 1%;color: #fff;font-size: 140%;font-weight: bold;vertical-align: sub;font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro';}
.frontPage .stepSec .list_step{justify-content: center; align-items: flex-end;}
.frontPage .stepSec .list_step p{margin: 10px 10px;}
.frontPage .stepSec .list_step04{margin-left: 300px;}
.frontPage .stepSec .list_step04 .img_step04_02{width: 50%;}
.frontPage .stepSec .list_step05{/*justify-content: flex-end; */width: 83%; margin: 20px auto 30px;}
.frontPage .stepSec .list_step05 li{font-size: 1em; width: 42%; height: auto; margin: 10px 0 0 10px; background: #F1EDE6; padding: 25px;}
.frontPage .stepSec .list_step05 dd{margin-top: -0.5em; font-size: 1.1em;}
.frontPage .stepSec .list_step05 dt{font-size: 1.4em; font-weight: 900; margin-bottom: 0.8em;color: #42210B; font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro';}
.frontPage .stepSec .txt_step05{text-align: center; font-size: 2em; font-weight: 900; color: #42210B;font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro';}


/*--英語が上達しやすい！その理由--*/
.frontPage .topicSec .topicBox{background: #f1ede6;padding: 40px 90px; margin-bottom: 20px;}
.frontPage .topicSec .topicBox h3{font-size: 1.9em;font-family: 'Noto Serif JP', serif, 'Hiragino Mincho Pro'; font-weight: 900;margin-bottom: 0.5em;}
.frontPage .topicSec .topicBox p{font-size: 1.2em;}
.frontPage .topicSec .topicBox h3,
.frontPage .topicSec .topicBox p{text-align: center;}

.frontPage .topicSec .topicBox_white01,
.frontPage .topicSec .topicBox_white02,
.frontPage .topicSec .topicBox_white03{background: #fff; padding: 30px 40px; margin-top: 20px; position: relative;}

.frontPage .topicSec .topicBox_white01 {position: inherit;}
.frontPage .topicSec .topicBox_white01 ul{/*justify-content: space-between;*/ margin: 0 auto;}
.frontPage .topicSec .topicBox_white01 li {position: relative;margin: 2.5em 0.6em 0;}
.frontPage .topicSec .topicBox_white01 li:nth-child(2){margin: 0 1em; z-index: 1;}
.frontPage .topicSec .topicBox_white01 li img{width: 170px;}
.frontPage .topicSec .topicBox_white01 li p{position: absolute;}
.frontPage .topicSec .topicBox_white01 li p img{width:70%;}
.frontPage .topicSec .topicBox_white01 .fukidashi01{text-align: left; bottom: 0; left: -5em;}
.frontPage .topicSec .topicBox_white01 .fukidashi02{text-align: right; top: 1em; right: -2.5em;}
.frontPage .topicSec .topicBox_white01 .fukidashi03{text-align: right; top: 2.5em; right: -3.5em;}

.frontPage .topicSec .topicBox_white02{padding-top: 65px;}
.frontPage .topicSec .topicBox_white02 p{text-align: left;width: 64%;}
.frontPage .topicSec .topicBox_white02 p img{margin: 0; position: absolute; bottom: 0; right: 5%}

.frontPage .topicSec .topicBox_white03 {padding-bottom: 0;}
.frontPage .topicSec .topicBox_white03 p{margin: 0; letter-spacing: -0.07em}
.frontPage .topicSec .topicBox_white03 img{width: 35%;}
.frontPage .topicSec .topicBox_white03 .fukidashi04{position: absolute; text-align: right; top: 12%; left: -4%;}
.frontPage .topicSec .topicBox_white03 .fukidashi05{position: absolute; text-align: left; bottom: 3%; right: -4%;}
.frontPage .topicSec .topicBox_white03 .fukidashi04 img,
.frontPage .topicSec .topicBox_white03 .fukidashi05 img{width: 50%;}


/*--priceBox--*/
.frontPage .priceBox{background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 10%, rgba(255,255,255,0.9) 90%,rgba(255,255,255,0) 100%); padding: 0.5em;margin: 2em auto 1.5em; width: 55%;}
.frontPage .priceBox .price{color: #D12222; font-size: 2.5em; line-height: 0.7em;margin-top: 0.8em;}
.frontPage .priceBox .price strong{font-size: 1.3em; vertical-align: top; padding-left: 0.1em;}
.frontPage .priceBox .price span{font-size: 0.5em;}
.frontPage .priceBox .price .kome{font-size: 0.4em;color: #42210B; font-weight: bold;}
.frontPage .priceBox .atari{border: 3px solid #D12222; border-radius: 5px; padding: 0.2em 0.3em 0.3em; line-height: 1em; font-size: 190%; margin: 0.5em; margin-left: 2em;}
.frontPage .priceBox .atari span{font-size: 0.53em; font-weight: bold;}
.frontPage .priceBox .atari strong{padding-left: 0;}


/*--解き進めれば、さらなる難問にもチャレンジできる！--*/
.frontPage .dojoSec{}
.frontPage .dojoSec h2{letter-spacing: -0.05em;}
.frontPage .dojoSec .txt{text-align: center; font-size: 1.2em; font-weight: 500; margin-bottom: 1.2em;}
.frontPage .dojoSec .btnList{justify-content: center; margin-bottom: 40px;}
.frontPage .dojoSec .btnList li{margin: 0 10px;}
.frontPage .dojoSec .btnList img{width: 320px}
.frontPage .dojoSec .dojoBox{background: #fff; width: 750px; margin: 0 auto 40px;}
.frontPage .dojoSec .dojoBox h3{background: #42210B; padding: 0.8em 2em; margin: 0 auto;}
.frontPage .dojoSec .dojoBox .dojoBoxInner{padding: 2em ; font-size: 1.2em;}
.frontPage .dojoSec .dojoBox p{margin: 0;}
.frontPage .dojoSec .dojoBox .img img{width: 100%;}
.frontPage .dojoSec .dojoBox .otherBox{align-items: center; justify-content: center;}
.frontPage .dojoSec .dojoBox .txt_other{width: 60%;}
.frontPage .dojoSec .dojoBox .txt_other.w100{width: 100%; margin-bottom: 1em;}
.frontPage .dojoSec .dojoBox .img_other{padding: 0 0 3% 2%;margin: 0;}
.frontPage .dojoSec .dojoBox .img_other img{width: 255px;}
.frontPage .dojoSec .dojoBox .ttl_other {background: #736357; color: #fff; font-weight: 600;margin: 1.5em auto 0;padding: 1em 1em 0.8em;}
.frontPage .dojoSec .dojoBox dl{margin: 1em auto 1.5em;}
.frontPage .dojoSec .dojoBox dt{margin-bottom: 0.2em;}
.frontPage .dojoSec .dojoBox dd{border-bottom: dashed 1px #736357;margin-bottom: 0.8em;padding-left: 0.9em;}
.frontPage .dojoSec .dojoBox03 img {width: 100%;}


.frontPage #bottomArea {padding-top: 46px;}
.frontPage #bottomArea .priceInner{margin: 0 auto;width: 650px;}
.frontPage #bottomArea .txt{color: #42210B; font-size: 1.4em; margin: 0 0 0 2em; position: relative; z-index: 1;}
.frontPage #bottomArea .priceBox{margin: 0 auto 1.5em;width: 100%;padding: 0;padding: 0.5em 0 0.1em;}
.frontPage #bottomArea .price{color: #D12222; font-size: 3em; line-height: 0.8em;margin: 25px auto 20px;text-align: center;}
.frontPage #bottomArea .price strong{font-size: 1.3em; vertical-align: top; padding-left: 0.1em;}
.frontPage #bottomArea .price span{font-size: 0.5em;}
.frontPage #bottomArea .price .kome{font-size: 0.4em;color: #42210B;}
.frontPage #bottomArea .img_fee02{ width: 120px; margin-left: 0.5em;margin-top: -0.5em;}
.frontPage #bottomArea p{font-size: 1.4em;font-weight: 600;text-align: center;margin-bottom: 100px;}
#box_policy{justify-content: center;align-items: center;background-color: #000; width: 100%; padding: 0.5em 0;}
#box_policy li{margin: 0 1em; padding: 0; text-align: center; width: 10em;}
#box_policy li:first-child {width: 25em;font-size: 130%;}
#box_policy li a{color: #fff;}
#bottomAreaInner h2{margin-top: 37px;}
#footerCopyright{background: #000 !important;}

#footerArea{font-size: 74%;}

#risusapuSec {background: url("../images/img_contents32_back.png") bottom center no-repeat; margin-top: 110px; padding-top: 1px;}
#risusapuSec .risusapuInner{ margin-top: -30px;}
#risusapuSec .risusapuInner img{ margin: 0 auto; padding-left: 3em; width: auto;}

/*----------------------------------------------------------------------------
 ***                                                         topics
----------------------------------------------------------------------------*/
#topics{width:950px; margin:20px auto 80px auto; background: #FFFFFF }
#topics .topicBox_all{padding: 0 0 30px 0; }
#topics .subtitleBox3 h3{margin:40px 40px 20px 40px; padding: 40px 0 0 0;  border-bottom:1px solid #000000; font-size:20px;}
#topics .topicsBox{display:flex; margin:15px 60px 0px 60px; border-bottom: 1px dotted #000000;}
#topics .topicsBox:last-child{border-bottom: none;}
#topics .topicsBox img{margin:0 20px 15px 0px; width:80px; height:80px; }
#topics .keisai span{width:80px; border:1px solid #000000; padding:1px 5px 0 5px; margin:0 5px 0 0;}
#topics .naiyou{padding:10px 0 0 0; font-size:14px;}
#topics .topicsBox dt{padding:10px 0 0 0;}
#topics .topicsBox dl{ font-size:14px;}



/*----------------------------------------------------------------------------
 ***                                                                policySec
----------------------------------------------------------------------------*/

#policySec { padding-bottom:30px;}
#policySec h2{ text-align:center; font-size:28px; color:#e91e63; padding:5px 0 25px;}
#policySec p{ font-size:14px; margin:15px 0 6px 0;}
#policySec h3{ font-size:18px; border-left:10px solid #e91e63; padding-left:0.3em; line-height:2em; margin-bottom:10px;}
#policySec .txtBox { font-size:12px; line-height:1.5em; margin:2px 0 4px 0;}
#policySec .section{ margin:20px 0 0;}

/*----------------------------------------------------------------------------
 ***                                                               infomation
----------------------------------------------------------------------------*/
#news{ width:750px; margin:0 auto 40px; border:3px #c5c5c5 solid;}
#news ul{ margin:25px 100px;}
#news ul li{ border-bottom:1px #c5c5c5 dashed; padding:5px 0 5px 0;margin-bottom: 1em;}
#news ul li:last-child{ border:none;}
#news span{ padding-right:15px;}
#news .kiji dl dt{margin-bottom: 0.5em;}
#news .kiji dl dd{padding-left:1em;margin-bottom: 0.5em;}
#news .kiji dl dd span{color: #e91e63; display:initial;}

/*----------------------------------------------------------------------------
 ***                                                                     about
----------------------------------------------------------------------------*/
#aboutSec{ padding-bottom:30px;}
#aboutSec #titleBox h2{ text-align:center; font-size:28px; color:#e91e63; padding:5px 0 10px; }
#aboutSec #titleBox p{ text-align:center;}
#aboutSec h3{ font-size:18px; border-left:10px solid #e91e63; padding-left:0.3em; line-height:2em; margin-bottom:10px;}
#aboutSec p{ font-size:14px; margin:15px 0 6px 0;}
#aboutSec section{ margin:35px 0 20px;}
#aboutSec .txtBox { font-size:12px; line-height:1.4em; margin:2px 0 4px 0;}
.appFunction{ background:#F5F5F5; border-radius:15px; padding:15px 25px; margin-bottom:13px;}
.appFunction h4 { color:#e91e63; padding-bottom:5px;}
.appFunction #smallTxt{ font-size:12px;}

/*----------------------------------------------------------------------------
 ***                                                                faqSec
----------------------------------------------------------------------------*/

#faqSec { padding-bottom:30px;}
#faqSec h2{ text-align:center; font-size:28px; color:#e91e63; padding:5px 0 25px;}
#faqSecc p{ margin:15px 0 6px 0;}
#faqSec h3{ font-size:18px;line-height:2em; margin-bottom:10px; background:#fff1f6; border-bottom:1px solid #e91e63; padding-left:0.5em;}
#faqSec h3 span{ font-size:25px; padding-right:0.4em; color:#e91e63;}
#faqSec .txtBox { font-size:14px; line-height:1.6em; margin:0; padding:0 1.5em;}
#faqSec .section{ margin:20px 0 0; padding-bottom:10px;}


/*----------------------------------------------------------------------------
 ***                                                                transactions
----------------------------------------------------------------------------*/

#transactionsSec{}
#transactionsSec #titleBox h2{text-align: center; color: #e91e63;}
#transactionsSec .section{ margin: 15px auto 0; display: flex; width: 607px;}
#transactionsSec h3{font-size: 18px; padding: 0 0.5em 0 0.5em; line-height: 2em; margin: 0 15px 5px 0; width: 130px; background: #f3f3f3;}
#transactionsSec .txtBox{font-size: 12px; line-height: 1.5em; margin: 2px 0 4px 0;}