@charset "utf-8";
/* ============================================================
給付ページ　PC SP共通
============================================================ */
.column span.line{
    background: url(/lesson/img/bg_line.gif) repeat-x left 90%;
}

	.column #column .greenTxt{color: #00ae28;}
	.column #column .boldTxt{font-weight: bold;}
	   
	.column #column .title .titlesecTtl{background: #e8f5db; color: black;text-align: center;font-weight: bold;}
	.column #column .title .day{text-align: right;color: #747474}
		
	.column #column .captionTitle{font-weight: bold;border-left: 6px solid #009E24 ;line-height: 1.2;padding-left: 1.3%}
	.column #column .subTitle{font-weight: bold;}
	.column #column .exTxt{font-size: 15px;font-weight: normal}

	/*翻訳型プロセス*/
	.column #column #translationSec .process{background:#eeeeee;}
	.column #column #translationSec .graph{color: #00ae28;font-weight: bold;}
	.column #column #translationSec .graphli{position: relative;border:3px solid #009944 ;background: white;display: flex;align-items: center;}
	.column #column #translationSec .graphli::after{content: ""; border-color: transparent transparent transparent #00ae28;position: absolute;}
	.column #column #translationSec .graphli:last-child::after{display: none}
	.column #column #translationSec .anser .anserSubtitle{color: white;background: #FB8D20;display: inline;font-weight: bold;}
	
	/*対人間力*/
	.column #skillSec{background: #e8f5db;}
	.column #skillSec .skillsecTtl{color: #009E24;font-weight: bold;text-align: center;}
	.column #column #skillSec .skillContents .hearSkillul{display: flex;}
	.column #column #skillSec .hearSkill{background:#ffeba2;text-align: center;border-radius: 10px;}
	.column #column #skillSec .skillContents .skillSubtitle{color: white;background: #009E24;display: inline;font-weight: bold;}

	.column #column #skillSec .skillContents .lessonlul{display: flex;}
	.column #column #skillSec .skillContents .lessonli{background:#ffeba2;text-align: center;}
	.column #column #skillSec .skillContents .lessonSub{background:#FB8D20 ;color: white;font-weight: bold;margin: auto;}
	.column #column #skillSec .skillContents .lessonTxt{text-align: left}


	/*「伝える・受け取る力」5つの要素*/
	.column #column #fiveSec .fiveContents{background: #e8f5db;}
	.column #column #fiveSec .fiveContents .fivesecTtl{color: #009E24;font-weight: bold;text-align: center;}
	.column #column #fiveSec .fiveContents .fiveLi {background-color: white;}
	.column #column #fiveSec .fiveContents .fiveSub {color: #00ae28;font-weight: bold;}

	
	.column #column #confidenceSec .confidenceSubtitle{color: white;background: #009E24;display: inline;font-weight: bold;}

	/*一生ものの自信*/
	.column #column #confidenceSec .confidenceContents{position: relative;border:3px solid #009944;border-radius: 10px; }
	.column #column #confidenceSec .confidenceTitle{color: #009E24;font-weight: bold;text-align: center;}

	/*分かりあえる英会話。「話せる」のその先へ*/
	.column #column #talkeSec .talkTitle{color: #009E24;font-weight: bold;}

	/*無料体験レッスン受付中*/
	.column #column #cvbtnSec .cvbtn{background: #e8f5db;border-radius: 10px;position: relative;}
	.column #column #cvbtnSec .cvbtnsecTtl{color: #009E24;font-weight: bold;text-align: center;display: block;}
	
@media only screen and (min-width: 641px) , print { 
/******************************************
   PC   641px以上の記述 
******************************************/

	.column .main_img.main_img_column{
    margin: 0 ;
    background: url(/column/img/main_img_column01.jpg) no-repeat center center;
    background-size: cover;}
	.column .ttl02{ margin-bottom:30px;}
	
	.column #column .yellowLine{ ;border-bottom: 5px solid #fbc95f;margin-bottom: 0;}
	
	.column #column .title .titlesecTtl{font-size: 40px; height: 80px; line-height: 85px;margin: 30px auto 20px;}
	.column #column .title .day{margin-bottom: 15px;}
	
	.column #column .captionTitle{font-size:25px;margin-bottom: 0.5em;}
	.column #column .text{font-size: 16px;margin-bottom: 3em}	
	.column #column .subTitle{font-size: 20px;}	
	.column #column .exTxt{font-size: 15px;margin-left: 1em;}	

	/*翻訳型プロセス*/
	.column #column #translationSec .process{margin-top: 0.7em;padding: 1% 2.5%;}
	.column #column #translationSec .processContent{position: relative;}
	.column #column #translationSec .graph{font-size: 22px;width: 80%;margin-bottom: 0.5em;}
	.column #column #translationSec .graphUl{display: flex;justify-content: space-between;margin-top: 0.3em;}
	.column #column #translationSec .graphli{padding: 0.5em;height: 60px;}
	.column #column #translationSec .processImg{position: absolute;right: 0em;top:-1.5em;}
	.column #column #translationSec .graphli::after{top: 50%;right: -16px;transform: translateY(-50%);border-style: solid; border-width: 12px 0 12px 14px; }
	.column #column #translationSec .anser {margin-top: 2em;}
	.column #column #translationSec .anser .anserContents{position: relative}
	.column #column #translationSec .anser .anserSubtitle{padding: 0.2% 1%;font-size: 18px;}
	.column #column #translationSec .anser .anserText{margin-top: 0.5em;width: 75%;}
	.column #column #translationSec .anser .anserImg{position: absolute;right: 2em;top:-3.5em;}

		/*対人間力*/
	.column #skillSec{padding: 4% 4.5% 2%}
	.column #skillSec .skillRead{width: 806px;margin: 0 auto 3em;}
	.column #skillSec .skillsecTtl{font-size: 40px;padding-bottom:0.7em; line-height: 1.2;}
	.column #skillSec .skillImg{margin-bottom: 1.5em; }
	.column #skillSec .meetImg{margin-bottom: 3em; }
	.column #column #skillSec .text{margin-bottom: 2em}	
	
	.column #column #skillSec .skillContents .skillSubtitle{padding: 0.8% 2%;font-size: 23px;}
	.column #column #skillSec .skillContents .skillText{margin: 1.3em 0;}
	.column #column #skillSec .skillContents .hearSkillul{display: flex;justify-content: space-between;}
	.column #column #skillSec .skillContents .hearSkill{background:#ffeba2 ;font-size: 15px;padding: 1.3em;margin-top: 0.7em;}
	.column #column #skillSec .skillContents .triangle{width: 0;height: 0;border-right: 15px solid transparent;border-top: 16px solid #00ae28;border-left: 15px solid transparent;margin: 1.5em auto;}

	.column #column #skillSec .skillContents .lessonli{width: 25%;padding: 0.8em;border-right: 2px solid white;margin: 0.7em auto 1em;;}
	.column #column #skillSec .skillContents .lessonli:last-child{border: none;}
	.column #column #skillSec .skillContents .lessonSub{width: 88%;padding:0.3em; }
	.column #column #skillSec .skillContents .lessonTxt{font-size: 15px;margin: 0.5em auto;width: 180px; }
	
	/*「伝える・受け取る力」5つの要素*/
	.column #column #fiveSec{margin: 4em 0;}
	.column #column #fiveSec .text{margin-bottom: 1em;}
	.column #column #fiveSec .fiveContents{padding: 4% 4.5% 5%}
	.column #column #fiveSec .fiveContents .fivesecTtl{font-size: 40px;padding-bottom:0.7em; line-height: 1.2;}
	.column #column #fiveSec .fiveContents .smallTitle{font-size: 30px;}
	.column #column #fiveSec .fiveContents .fivelUl {display: flex;justify-content: center;flex-wrap:wrap; gap: 20px 20px; }
	.column #column #fiveSec .fiveContents .fiveLi {padding: 1em 1.5em;font-size: 15px;width: 25%;}
	.column #column #fiveSec .fiveContents .fiveSub {font-size: 20px;margin: 0.5em 0 0.3em;}
	
	/*一生ものの自信*/
	.column #column #confidenceSec .confidenceContents{padding: 2em 0 2em 2em;}
	.column #column #confidenceSec .confidenceTitle{font-size: 40px;padding-bottom:0.7em; line-height: 1.2;}
	.column #column #confidenceSec .confidence .confidenceRead{padding-bottom:1.7em; }
	.column #column #confidenceSec .confidenceImg {margin-bottom: 1em;}
	.column #column #confidenceSec .confidenceContents {display: flex;}
	.column #column #confidenceSec .confidenceSubtitle {padding: 0.8% 2%;font-size: 23px;margin-bottom: 0.5em;}
	.column #column #confidenceSec .confidenceLi {margin: 0 0 2em;}
	.column #column #confidenceSec .confidenceLi:last-child{margin:0;}
	.column #column #confidenceSec .confidenceContentsimg {margin:auto;}
	
	/*分かりあえる英会話。「話せる」のその先へ*/
	.column #column #talkeSec .talkTitle{font-size: 40px; line-height: 1.2;}
	
	/*無料体験レッスン受付中*/
	.column #column #cvbtnSec .cvbtn{padding: 4% 4.5% 2%}
	.column #column #cvbtnSec .cvbtnsecTtl{font-size: 40px; line-height: 1.2;}
	.column #column #cvbtnSec .cvTxt{width: 80%;margin: 1em auto;}
	.column #column #cvbtnSec .cvcontentsImg{position: absolute;top:5em;right: 1em;}
	

}/* PC用の記述ここまで*/

@media only screen and (max-width: 640px) { 
/******************************************
   SP   640px以下の記述 
******************************************/
body.benefit article {
    font-size: 14px;
}
	
	#column{width: 94%;margin: auto;}
	.column .main_img.main_img_column{margin: 0 0 33px 0; background: url(/column/img/main_img_column01.jpg) no-repeat center 50%; background-size: cover;}

	.column #column .yellowLine{border-bottom: 2px solid #fbc95f;}
	.column .ttl02{ margin-bottom:30px;}
	.column #column .yellowLine{ ;border-bottom: 5px solid #fbc95f;margin-bottom: 0;}
	
	.column #column .title .titlesecTtl{font-size: 180%; padding: 3%;margin: 23% auto 4%;}
	.column #column .title .day{margin-bottom: 4%;}
	
	.column #column .captionTitle{font-size:145%;margin-bottom: 0.5em;}
	.column #column .text{margin-bottom: 3em}	
	.column #column .subTitle{font-size: 140%;}	
	.column #column .exTxt{font-size: 80%;margin-left: 1em;}	

	/*翻訳型プロセス*/
	.column #column #translationSec .process{margin-top: 1.5em;padding: 4% 2.5%;}
	.column #column #translationSec .processContent{position: relative;}
	.column #column #translationSec .graph{font-size: 130%;margin-bottom: 0.5em;}
	.column #column #translationSec .graphUl{display: flex;justify-content: space-between;margin-top: 0.3em;flex-wrap: wrap;}
	.column #column #translationSec .graphli{padding: 0.5em;height: 40px;width: 35%;justify-content: center;margin: auto;}
	.column #column #translationSec .graphli:nth-child(n + 3){margin-top: 0.5em;}
	.column #column #translationSec .graphli::after{top: 50%;right: -16px;transform: translateY(-50%);border-style: solid; border-width: 12px 0 12px 14px; }
	.column #column #translationSec .anser {margin-top: 2em;}
	.column #column #translationSec .anser .anserContents{position: relative;margin-top: 4%}
	.column #column #translationSec .anser .anserSubtitle{padding: 0.8% 3%;font-size: 130%;}
	.column #column #translationSec .anser .anserText{margin-top: 0.5em;width: 70%;}
	.column #column #translationSec .anser .anserImg{position: absolute;right: 0em;top:1.5em;width: 25%}

		/*対人間力*/
	.column #skillSec{padding: 8% 4.5% 2%}
	.column #skillSec .skillRead{;margin: 0 auto 3em;}
	.column #skillSec .skillsecTtl{font-size: 200%;padding-bottom:0.7em; line-height: 1.2;}
	.column #skillSec .skillImg{width: 90%;margin: 3% auto 5%;}
	.column #skillSec .meetImg{margin-bottom: 3em; }
	.column #column #skillSec .text{margin-bottom: 2em}	
	
	.column #column #skillSec .skillContents .skillSubtitle{padding: 0.8% 2%;font-size:130%;}
	.column #column #skillSec .skillContents .skillText{margin: 3% 0 5%;}
	.column #column #skillSec .skillContents .hearSkillul{display: flex;justify-content: space-between;flex-wrap: wrap;}
	.column #column #skillSec .skillContents .hearSkill{background:#ffeba2 ;font-size: 107%;padding: 3% 2%;margin-top: 0.7em;width: 45%}
	.column #column #skillSec .skillContents .triangle{width: 0;height: 0;border-right: 15px solid transparent;border-top: 16px solid #00ae28;border-left: 15px solid transparent;margin: 1.5em auto;}

	.column #column #skillSec .skillContents .lessonlul{flex-wrap: wrap;}
	.column #column #skillSec .skillContents .lessonli{width: 43%;padding: 0.8em;border-right: 2px solid white;}
	.column #column #skillSec .skillContents .lessonli:nth-child(even){border: none;}
	.column #column #skillSec .skillContents .lessonli:nth-child(n + 3){border-top: 2px solid white;}
	.column #column #skillSec .skillContents .lessonSub{width: 96%;padding:0.3em; font-size: 110%}
	.column #column #skillSec .skillContents .lessonTxt{font-size: 100%;margin: 0.5em auto;width: 180px;width: 100%;}
	
	/*「伝える・受け取る力」5つの要素*/
	.column #column #fiveSec{margin: 4em 0;}
	.column #column #fiveSec .text{margin-bottom: 1em;}
	.column #column #fiveSec .fiveContents{padding: 4% 4.5% 5%}
	.column #column #fiveSec .fiveContents .fivesecTtl{font-size:200%;padding-bottom:0.7em; line-height: 1.2;display: block;}
	.column #column #fiveSec .fiveContents .smallTitle{font-size: 75%;}
	.column #column #fiveSec .fiveContents .fiveLi {display: flex;padding: 3% 2%;font-size: 110%;margin: 5% 0}
	.column #column #fiveSec .fiveContents .fiveImg{width: 40%;margin: auto 2% auto 0}
	.column #column #fiveSec .fiveContents .fivesubContents{width: 65%;}
	.column #column #fiveSec .fiveContents .fiveSub {font-size: 130%;margin: 0.5em 0 0.3em;}
	
	/*一生ものの自信*/
	.column #column #confidenceSec .confidenceContents{padding: 5% 3%;}
	.column #column #confidenceSec .confidenceTitle{font-size: 200%;padding-bottom:0.7em; line-height: 1.2;}
	.column #column #confidenceSec .confidence .confidenceRead{padding-bottom:1.7em; }
	.column #column #confidenceSec .confidenceImg {margin-bottom: 1em;}
	.column #column #confidenceSec .confidenceContents {display: flex;}
	.column #column #confidenceSec .confidenceSubtitle {padding: 0.8% 2%;font-size: 130%;margin-bottom: 0.5em;}
	.column #column #confidenceSec .confidenceLi {margin: 0 0 4%;}
	.column #column #confidenceSec .confidenceLi:last-child{margin:0;}
	.column #column #confidenceSec .confidenceContentsimg {margin:auto;}
	
	/*分かりあえる英会話。「話せる」のその先へ*/
	.column #column #talkeSec .talkTitle{font-size: 200%; line-height: 1.2;}
	
	/*無料体験レッスン受付中*/
	.column #column #cvbtnSec .cvbtn{padding:9% 4%}
	.column #column #cvbtnSec .cvbtnsecTtl{font-size: 200%; line-height: 1.2;}
	.column #column #cvbtnSec .cvTxt{width: 95%;margin: 3% auto 6%;}
	.column #column #cvbtnSec .cvcontentsImg{position: absolute;top:5em;right: 1em;}
	
}　/* sp用の記述ここまで */
