@charset "utf-8";

body{font-family: lineseed,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";}
img{width:100%;}

/* ---------------------------------------------------------
■ ヘッダー
--------------------------------------------------------- */
header {
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
    background-color: #002b69;
    overflow: hidden;
	position: fixed;
    z-index: 15;
    transition:0.2s;
}

#head_btnbox {
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
    background-color: #002b69;
    overflow: hidden;
    padding: 5px;
}

/*追従ヘッダー*/
header #head_btnbox{
	position: fixed;
	height: 65px;
    top: 0;
	width: 100%;
	z-index: 500;
}
@media screen and (max-width: 767px){
	header #head_btnbox{
		height: 43px;
	}
}

/* ---------------------------------------------------------
■ TOPボタン
--------------------------------------------------------- */

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 100;
}
#page-top a {
	text-decoration: none;
	text-align: center;
	color: #444;
	font-size: 70%;
	font-weight: bold;
	background: rgba(237, 237, 237,.8);
	width: 60px;
	aspect-ratio:3/2;
	border-radius: 15px;
	display: flex;
	transition: .1s;
}
#page-top a span{
	display: block;
	margin: auto;
}
@media screen and (min-width: 767px) {
	#page-top a:hover{
		opacity: .7;
	}
}

/*-----------------------------------------
 TOP申し込みボタン
 -----------------------------------------*/

.head_apply_btn{padding-right:8px;}

.head_apply_btn a{
	position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    background-color:#FFF000;
    border: 3px solid #FFF000;
	padding:6px 12px;
    border-radius: 3px;
    transition: .2s;
}
.head_apply_btn a span{margin:auto 0;display:block;}
.head_apply_btn a span:nth-child(1){width:30px;line-height:0;transition: .2s;}
.head_apply_btn a svg{transition: .2s;}
.head_apply_btn a svg path {fill:#222;stroke-width: 0px;}
.head_apply_btn a span:nth-child(2){width:calc(100% - 35px);color:#222;font-weight:700;}

@media screen and (min-width:768px) {
	.head_apply_btn a:hover{background-color:rgba(0,0,0,0);}
	.head_apply_btn a:hover span:nth-child(2){color:#FFF000;}
	.head_apply_btn a:hover svg path {fill:#FFF000;}
}

/*-----------------------------------------
 資料請求ボタン
 -----------------------------------------*/

.head_request_btn{padding-right:8px;}

.head_request_btn a{
	position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    border: 3px solid #FFF000;
	padding:4px 12px;
    border-radius: 3px;
    transition: .2s;
}
.head_request_btn a span{margin:auto 0;display:block;}
.head_request_btn a span:nth-child(1){width:22px;line-height:0;transition: .2s;}
.head_request_btn a svg{transition: .2s;}
.head_request_btn a svg path {fill:#FFF000;stroke-width: 0px;}
.head_request_btn a svg rect {fill:#FFF000;stroke-width: 0px;}
.head_request_btn a span:nth-child(2){width:calc(100% - 27px);color:#FFF000;font-weight:700;}

@media screen and (min-width:768px) {
	.head_request_btn a:hover{background-color:#FFF000;}
	.head_request_btn a:hover span:nth-child(2){color:#222;}
	.head_request_btn a:hover svg path {fill:#222;}
	.head_request_btn a:hover svg rect {fill:#222;}
}


/*-----------------------------------------
 TOP校舎検索
 -----------------------------------------*/
.head_map_btn{padding-right:8px;}

.head_map_btn a{
	position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    border: 3px solid #FFF000;
	padding:6px 12px;
    border-radius: 3px;
    transition: .2s;
}
.head_map_btn a span{margin:auto 0;display:block;}
.head_map_btn a span:nth-child(1){width:25px;line-height:0;transition: .2s;}
.head_map_btn a svg{transition: .2s;}
.head_map_btn a svg path {fill:#FFF000;stroke-width: 0px;}
.head_map_btn a rect {fill:#FFF000;}
.head_map_btn a span:nth-child(2){width:calc(100% - 30px);color:#FFF000;font-weight:700;}

@media screen and (min-width:768px) {
	.head_map_btn a:hover{background-color:#FFF000;}
	.head_map_btn a:hover span:nth-child(2){color:#222;}
	.head_map_btn a:hover svg path {fill:#222;}
	.head_map_btn a:hover svg rect {fill:#222;}
}




/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */
footer {
	width: 100%;
	text-align: center;
  	background-color:#002B69;
	color:#fff;
	padding:60px 0;
}
footer a{
	color:#fff;
}
footer .logo{
	width:50%;
	max-width: 570px;
}

footer ul {
    margin: 40px auto 0;
    text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}
footer ul div {
    display: inline-block;
}
footer ul li {
    display: inline-block;
    color: #fff;
    letter-spacing: -0.01em;
}
footer ul li::before {
	content: "｜";
    padding: 0 10px;
}
footer ul li:first-child:before {
    content: "";
    padding: 0;
}


/* ---------------------------------------------------------
■ ライトボックス
--------------------------------------------------------- */
.featherlight{ padding: 2%}

.lightbox{
	display: none;
	width: 100%;
	height: 100%;
	overflow: auto;
	text-align: left;
    padding: 20px;
	background-color:#fff;
}

@media screen and (max-width: 767px){
	.lightbox {
	    padding: 25px 20px;
	}
}


/* ---------------------------------------------------------
■ フェードイン
--------------------------------------------------------- */
.fadein {
  visibility: hidden; }

.fadein_delay {
	-webkit-animation-delay: 0.8s;
	-ms-animation-delay: 0.8s;
	animation-delay: 0.8s;
}

.fadeInDown {
  visibility: visible;
  -webkit-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
  -ms-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown; }

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }


/* ---------------------------------------------------------
■ フェードインｊｓ
--------------------------------------------------------- */
.Fade_In{
	opacity: 0;
  	transition: all .5s ease;
	transform: translate(0, 100px);
}

.Fade_In.show{
  opacity: 1;
  transform: none;
}

/*----------------------------------------------------------
ハンバーガーメニュー
----------------------------------------------------------*/

.head-02.open {
  transform: translateX(10%);
  visibility: visible;
}
.lp-header__trigger.open span:nth-child(1) {
  transform: rotate(45deg);
}

.lp-header__trigger.open span:nth-child(2) {
  opacity: 0;
}

.lp-header__trigger.open span:nth-child(3) {
  transform: rotate(-45deg);
}
.head-wrap {
  position: relative;
}
.head-nav {
  display: flex;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
	padding:8px 0;
}
.head-nav img {
  margin: 0 auto;
  display: block;
}
.head-items {
  display: flex;
  list-style: none;
  color: #ffffff;
  padding: 0;
  margin: 0 0 0 auto;
}
.head-items li {
  margin-right: 3em;
}
@media screen and (max-width: 1000px) {
  .head-items li {
    margin-right: 1.2em;
	  font-size:80%;
  }
}

.head-items a {
  text-decoration: none;
  color: #ffffff;
}
.head-items a:hover {
  color: #c6c6c6;
}
.lp-header__trigger {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 10px;
  background: none;
  border: none;
  padding: 0;
  height: 24px;
  cursor: pointer;
  margin: 0 0 0 auto;
  display: none;
}
.lp-header__trigger span {
  display: block;
  width: 22px;
  height: 2px;
  background: #e6e6e6;
  margin-bottom: 7px;
  transform-origin: center left;
  border-radius: 1px;
  transition: all 600ms ease;
}
.lp-header__trigger.open span{
  width: 25px;
}

.head-02 {
  width: 100%;
  transform: translateX(100%);
  position: fixed;
  background: rgba(0, 0, 0, 0.8);
  padding-top: 50px;
  padding-bottom: 21px;
  top: 0;
  right: 0;
  height: 100vh;
  z-index: 1;
  transition: all 600ms ease;
  visibility: hidden;
}
.head-02__wrap {
  padding: 0 10px;
}
.head-02 hr {
  margin: 0;
}
hr {
  border: none;
  border-top: 1px solid #888888;
  background: transparent;
}
.head-02__item {
  display: flex;
  align-items: center;
  position: relative;
  padding-right: 33%;
  color: #c6c6c6;
  padding: 17px;
}

.head-nav .head-logo{
	margin-left: 10px;
	height:40px;
	width:auto;
}

@media screen and (max-width: 767px) {
  .head-items {
    display: none;
    color: #dadada;
  }
  .lp-header__trigger{
    top: 20px;
    right: 20px;
    display: block;
  }
}

.header_after{
	height:58px;
}


/*----------youtube動画---------*/
.youtube{

}
.youtube iframe{
	aspect-ratio: 16 / 9;
	width:100%;
	height:auto;
}



/*=======================================
 ■ 追加分
=========================================*/

/*----------準備中---------*/
.preparation_box{
	padding:50px 30px;
	font-size:30px;
	line-height:1.4em;
	font-weight:900;
}


/*----------メインビジュアル---------*/

.mv_box{
	position:relative;
	width:100%;
	background-image: url("../images/mv_bk.webp");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.mv_box h1{
	margin:auto;
	max-width:1300px;
}

.mv_title_area{
	background-color:#ff8ba7;
}

.mv_title{
	line-height:0;
	margin: auto;
	max-width:1040px;
	padding:15px 20px;
	filter: drop-shadow(2px 2px 5px rgba(230,56,125,.8));
}



/*--------------導入テキスト--------------------*/
.introduction{
	width:100%;
	padding:130px 0 130px;
}

.introduction_box{
	width: 100%;
	max-width: 1380px;
	margin: auto;
	padding:0 40px;
}

.introduction_wrap{
	display: flex;
	flex-wrap:wrap;
	gap:40px;
}
.intro_mv{width:50%;line-height:0;}
.intro_text{width:calc(50% - 40px);}

.intro_text h2{
	text-align:left;
	width:100%;
	color:#4f4747;
	font-size:40px;
	font-weight:600;
	line-height:1.25em;
}
.intro_text p{
	width:100%;
	color: #4f4747;
	margin: auto;
	padding-top: 20px;
	line-height: 1.7em;
	font-size:20px;
	font-weight:600;
}

/*-----導入（動画OFF）-----*/

.introduction_wrap.mv_off{

}

.introduction_wrap.mv_off .intro_mv{display:none;}
.introduction_wrap.mv_off .intro_text{width:70%;margin:auto;max-width:900px;}



/*--------------ここがすごい--------------------*/

.point_area{background-color:#fffcec;}
.point_box{
	width: 100%;
    padding:90px 20px;
    background: url(../images/point_bk.webp);
    background-size:100%;
    background-repeat: repeat-y;
}

.point_title{
	position: relative;
	margin: auto;
	max-width:1300px;
	padding:0 100px 20px;
}
.point_title::before,.point_title::after{
	content:"";
	position: absolute;
	display:block;
	width:80px;
	height:100%;
	bottom:0;
	background-image: url("../images/point_title_frame.webp");
	background-size: contain;
	background-position: center bottom;
	background-repeat: no-repeat;
}
.point_title::before{left:0;}
.point_title::after{right:0;transform: scale(-1,1);}

.point_title h2{
	display: flex;
	flex-wrap:wrap;
}
.point_title h2 img{margin: auto 0 0; width:50%;}
.point_title h2 img[src*="01"]{}
.point_title h2 img[src*="02"]{width:52%;margin-left:-2%;}

.point_img_wrap{
	display: flex;
	flex-wrap:wrap;
	gap:40px;
	margin: auto;
	max-width:1160px;
	padding:20px 30px 0;
}
.point_img_inner{width:calc((100% - 40px)/ 2);}

.point_img_inner h3{
	text-align: left;
    color: #656464;
    margin: auto;
    font-size: 20px;
    font-weight: 600;
}



/*--------タブ切り替え部分-----------*/
.recommend{
	padding:140px 0 130px;
}
.recommend_box{
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding:0 20px;
}

.recommend_h2sub_frame{
	margin: auto;
	max-width:290px;
}

.recommend_h2sub{
	text-align: center;
	color: #4f4747;
    font-size:27px;
	line-height:1.3em;
    font-weight: 600;
	padding:6px 0 40px;
}

.recommend_box h2{
	display: flex;
	flex-wrap:wrap;
	padding-bottom:20px;
}
.recommend_box h2 span{display:block;}
.recommend_box h2 span:nth-child(1){
	width:31%;
	margin: auto 1% auto auto;
}
.recommend_box h2 span:nth-child(2){
	width:57%;
	margin: auto 0;
}
.recommend_box h2 span:nth-child(3){
	width:10%;
	margin: auto 0 20px 1%;
}

.recommend_bottom{
	text-align: center;
	color: #4f4747;
    font-size: 1.3em;
    font-weight: 600;
}

.campaign_spr .att{
	color: #4f4747;
    font-size: 0.9em;
	font-weight:600;
}

#tab1_content{
	background-color:#ff7f8e;
}

#tab2_content{
	background-color:#8dce1d;
}

#tab3_content{
	background-color:#3fbbd8;
}

.tab_content_inner{
	background-color: #fff;
	border-radius: 20px;
	padding:70px 20px 30px;
}

.tab_container {
	padding-bottom: 1em;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.tab_item{
	display: block;
	width: calc((100% - 40px) / 3);
	margin:auto 20px 0 0;
	padding:15px 0;
	background-color: #ececec;
	text-align: center;
	color: #fff;
	font-size: 26px;
	font-weight: bold;
	border-radius: 15px 15px 0 0;
	transition: all 0.2s ease;
}

.tab_item[for="tab1"]{
	background-color: #ff7f8e;
}
.tab_item[for="tab2"]{
	background-color: #8dce1d;
}
.tab_item[for="tab3"]{
	background-color: #3fbbd8;
	margin-right: 0;
}
@media screen and (min-width: 768px) {
	.tab_item:hover {
		padding-bottom: 1.4em;
	}
}
input[name="tab_item"] {
	display: none;
}

.tab_content {
  display: none;
}

#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content{
	display: block;
}
.tab_container input:checked + .tab_item {
	padding-bottom: 1.4em;
}

.tab_content{
	width:100%;
	padding: 2em;
	margin-top: -2px;
}

/*--------タブ中身-----------*/
.course_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;
	gap:20px;
    padding: 0 20px 70px;
}


#tab1_content .course_inner_box {background: linear-gradient(45deg, #ee6baa 3%, #ff7f8e, #fec537 94%);}
#tab1_content .course_inner_title .subject{color:#ff7f8e;}

#tab2_content .course_inner_box{background: linear-gradient(45deg,#40b451,#8dce1d,#85d3fb 94%);}
#tab2_content .course_inner_title .subject{color:#8dce1d;}

#tab3_content .course_inner_box{background: linear-gradient(45deg,#4da6d3,#3fbbd8 6%,#eea5c0 94%);}
#tab3_content .course_inner_title .subject{color:#8FB0CD;}


.course_inner_box{
	position: relative;
	cursor: pointer;
	display: block;
	width:calc((100% - 40px) / 3);
	box-shadow: 2px 2px 8px rgba(0,0,0,.25);
	transition: .2s;
}

.course_inner_detail{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	padding:10px;
}
.double .course_inner_detail{
	max-width:540px;
	margin: auto;
}

.course_inner_img{
	width:90px;
}
.course_inner_title{
	display: flex;
	flex-wrap: wrap;
	width:calc(100% - 90px);
	text-align: left;
	padding:0 0 0 10px;
}

.course_inner_title .subject{
	display: inline-block;
	margin:0 0 auto;
	background-color: #fff;
	font-weight:600;
	line-height:1.1em;
	font-size:1.3em;
	letter-spacing: 0.02em;
	padding: 4px 9px 0;
}
.course_inner_title .unit{
	display: inline-block;
	margin:0 0 auto;
	color:#fff;
	font-weight:600;
	line-height:1.1em;
	font-size:1.2em;
	letter-spacing: 0.02em;
	padding: 4px 9px 0;
	border:1px solid #fff;
}

.course_inner_title .title{
	display:block;
	width:100%;
	margin:0 0 auto;
	color: #fff;
	font-weight:600;
	font-size:1.45em;
	line-height: 1em;
	letter-spacing: 0.02em;
	padding: 8px 0 0;
}
.course_inner_title .title span{
	font-size:75%;
	letter-spacing:-0.03em;
}
.course_inner_text{
	width:calc(100% - 60px);
	text-align: left;
	color: #fff;
	font-size:1.1em;
	line-height: 1.2em;
	letter-spacing: 0.05em;
	padding: 15px 0 5px;
}

.course_inner_box img[src*="arrow"]{
	position: absolute;
	width:30px;
	right:18px;
	bottom:15px;
	transition: .2s;
}

@media screen and (min-width: 768px){
	.course_inner_box:hover{
		box-shadow:none;
	}
	.course_inner_box:hover img[src*="arrow"]{
		right:8px;
	}
}



/*--------POPUP部分-----------*/

.pop_box{
	max-width: 740px;
}

.atwill_detail{
	display: flex;
	flex-wrap: wrap;
	background: #fff;
	border-radius: 20px;
	padding:25px;
	color: #4f4747;
}
.atwill_detail_img{
	width:140px;
}
.atwill_detail_text{
	width:calc(100% - 140px);
	padding:0 0 0 20px;
	display: flex;
	flex-wrap: wrap;
}

.atwill_detail_text-inner{
	display: contents;
}

.atwill_tit{

}
.atwill_detail_text .subject{
	display:inline-block;
	background:#333;
	color:#fff;
	font-size:.95em;
	margin-bottom: auto;
	padding: 5px 17px 2px;
	font-weight:600;
	order:1;
}
.atwill_detail_text .unit{
	display:inline-block;
	font-size:.95em;
	margin-bottom: auto;
	padding: 4px 17px 1px;
	font-weight:600;
	border:1px solid #333;
	order:2;
}
.atwill_detail_text h3{
	display:block;
	width:100%;
	font-size: 1.5em;
	line-height:1.2em;
	font-weight:600;
	padding: 15px 0 5px;
	order:3;
}

.atwill-teacher{
	width:100%;
	font-weight:600;
	order:4;
}
.atwill-teacher span.teacher_bfr{
	background-color:#e6e6e6;
	padding:0 8px;
	font-size: .9em;
	font-weight:600;
	margin-right: 5px;
}
.atwill-teacher span.teacher_aft{
	font-size: .85em;
	font-weight:600;
}

.atwill_detail_main{
	width:100%;
	position: relative;
	margin-top: 15px;
	padding:15px 10px 0;
}
.atwill_detail_main::before{
	content: "";
	width: 100%;
	height:2px;
	position: absolute;
	top:0;
	left:0;
}

.atwill_catch{
	font-weight:600;
}

.lightbox[id*="basic"],.lightbox[id*="high1"]{background: linear-gradient(90deg,#ff7f8e,#ffb03f,#ff7f8e);}
.lightbox[id*="basic"] .atwill_detail_text .subject,.lightbox[id*="high1"] .atwill_detail_text .subject{background:#ff7f8e;}
.lightbox[id*="basic"] .atwill_detail_text .unit,.lightbox[id*="high1"] .atwill_detail_text .unit{color:#ff7f8e;border-color:#ff7f8e;}
.lightbox[id*="basic"] .atwill_detail_main::before,.lightbox[id*="high1"] .atwill_detail_main::before{background: linear-gradient(90deg,#ff7f8e,#ffdf22,#ff7f8e);}


.lightbox[id*="standard"],.lightbox[id*="high2"]{background: linear-gradient(75deg,#8dce1d,#57c18f,#8dce1d);}
.lightbox[id*="standard"] .atwill_detail_text .subject,.lightbox[id*="high2"] .atwill_detail_text .subject{background:#8dce1d;}
.lightbox[id*="standard"] .atwill_detail_text .unit,.lightbox[id*="high2"] .atwill_detail_text .unit{color:#8dce1d;border-color:#8dce1d;}
.lightbox[id*="standard"] .atwill_detail_main::before,.lightbox[id*="high2"] .atwill_detail_main::before{background: linear-gradient(90deg,#8dce1d,#88d4ff,#8dce1d);}


.lightbox[id*="advanced"],.lightbox[id*="high3"]{background: linear-gradient(75deg,#3fbbd8,#a6a5c8,#3fbbd8);}
.lightbox[id*="advanced"] .atwill_detail_text .subject,.lightbox[id*="high3"] .atwill_detail_text .subject{background:#3fbbd8;}
.lightbox[id*="advanced"] .atwill_detail_text .unit,.lightbox[id*="high3"] .atwill_detail_text .unit{color:#3fbbd8;border-color:#3fbbd8;}
.lightbox[id*="advanced"] .atwill_detail_main::before,.lightbox[id*="high3"] .atwill_detail_main::before{background: linear-gradient(90deg,#3fbbd8,#88d4ff,#3fbbd8);}


/*--------教師画像なし-----------*/
#no_img .course_inner_img{display: none;}
#no_img .course_inner_title{width:100%;padding:0;}

#no_img	.atwill_detail_img{display:none;}
#no_img	.atwill_detail_text{width:100%;padding:0;}
#no_img	.atwill-teacher{display:none;}



/*-----------注目ポイント---------------*/

.lesson_title{padding:0 30px 25px;}

.lesson_title h2{
	position: relative;
	line-height:0;
	margin: auto;
	max-width:660px;
	padding:0 130px;
}
.lesson_title h2::before,.lesson_title h2::after{
	content:"";
	position:absolute;
	top:0;
	display:block;
	width:auto;
	height:100%;
	aspect-ratio:3/2;
	background-image:url("../images/lesson_title_frame.webp");
	background-position: center;
	background-repeat: no-repeat;
	background-size:contain;
}
.lesson_title h2::before{
	left:0;
}
.lesson_title h2::after{
	right:0;
	transform: scale(-1,1);
}


/*--------注目ポイント 英検--------*/

.lesson_eiken_area{
	background-color:#ff93b1;
}
.lesson_eiken_box{
	position:relative;
}
.lesson_eiken_bk{
	position:absolute;
	bottom:0;
	left: 0;
	width:100%;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.lesson_eiken_bk > div{
	width:25%;
}
.lesson_eiken_bk > div:nth-child(2){
	transform: scale(-1,1);
}

.lesson_eiken_title{
	margin: auto;
	max-width:1400px;
	padding:50px 30px 0;
	line-height:0;
}

.lesson_eiken_main{
	position:relative;
	z-index: 2;
}

.lesson_eiken_courseimg{
	display:flex;
	flex-wrap:wrap;
	gap:0 1%;
	margin: auto;
	max-width:1200px;
	padding:50px 20px;
}

.lesson_eiken_courseimg div{margin:auto;}
.lesson_eiken_courseimg div:nth-child(1){width:18%;}
.lesson_eiken_courseimg div:nth-child(2){width:56%;}
.lesson_eiken_courseimg div:nth-child(3){width:24%;}

.lesson_eiken_link{
	padding:10px 20px 70px;
}
.lesson_eiken_link a{
    display: block;
    width: 100%;
	max-width:500px;
    margin: auto auto 0;
    position: relative;
    text-align: center;
    font-size:24px;
    padding: 8px;
    font-weight:800;
	letter-spacing:0.1em;
    color:#ff93b1;
	background-color: #fff;
    border: solid 3px #fff;
	border-radius:2em;
    transition: .2s;
}
.lesson_eiken_link a::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right:20px;
    width:15px;
    height:15px;
    transform: rotate(45deg);
    z-index: 1;
    border-top: 3px solid #ff93b1;
    border-right: 3px solid #ff93b1;
}
@media screen and (min-width: 768px) {
	.lesson_eiken_link a:hover{
		color:#fff;
		background-color:rgba(255,255,255,0);
	}
	.lesson_eiken_link a:hover::after {
		border-color:#fff;
	}
}


/*--------注目ポイント 最強講師陣--------*/

.lesson_teacher_area{
	background-image: url("../images/lesson_teacher_bk.webp");
	background-position: center;
	background-repeat: repeat-y;
	background-size: 100%;
}
.lesson_teacher_box{
	background-image: url("../images/lesson_teacher_frame.webp");
	background-position: center;
	background-repeat: repeat-y;
	background-size: 100%;
}

.lesson_teacher_wrap{
	margin: auto;
	max-width:1200px;
	padding:80px 20px 60px;
}

.lesson_teacher_title h3{
	display: flex;
	flex-wrap: wrap;
	gap:0 2%;
	margin: auto;
	max-width:700px;
}
.lesson_teacher_title h3 img{margin:auto;}
.lesson_teacher_title h3 img[src*="atwill_logo"]{
	width:33%;
}
.lesson_teacher_title h3 img[src*="lesson_teachers"]{
	width:65%;
}
.lesson_teacher_h3sub{
	padding:30px 0;
	text-align: center;
    color: #4f4747;
    font-size: 1.3em;
    font-weight: 600;
}

.lesson_teacher_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap:20px 1.5%;
}
.lesson_teacher_list > div:nth-child(1){width:100%;}
.lesson_teacher_list > div:nth-child(1) img{width:calc(((100% - 3%) / 7)* 3);}
.lesson_teacher_list > div:nth-child(2){width:calc(((100% - 1.5%) / 7)* 4);}
.lesson_teacher_list > div:nth-child(3){width:calc(((100% - 1.5%) / 7)* 3);}

.lesson_teacher_link{
	padding:40px 30px;
}

.lesson_teacher_linktext{
	padding:20px 0 5px;
	text-align: center;
    color: #4f4747;
    font-size:30px;
    font-weight: 600;
}

.lesson_teacher_link a{
	display: block;
    width: 100%;
	max-width:600px;
    margin: auto auto 0;
    position: relative;
    text-align: center;
    font-size:34px;
    padding: 8px;
    font-weight:700;
	letter-spacing:0.05em;
    color: #fff;
	background-color: #9d7c52;
    border: solid 3px #9d7c52;
	border-radius:2em;
    transition: .2s;
}

.lesson_teacher_link a::after{
	position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right:20px;
    width:15px;
    height:15px;
    transform: rotate(45deg);
    z-index: 1;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
}

@media screen and (min-width: 768px) {
	.lesson_teacher_link a:hover{
		color:#9d7c52;
		background-color:rgba(255,255,255,0);
	}
	.lesson_teacher_link a:hover::after {
		border-color:#9d7c52;
	}
}


/*-----------Campaign---------------*/

.campaign_spring_area{
	padding: 120px 0 0;
	background-image: url("../images/campaign_bk.webp");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.campaign_spring{
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding:0 20px;
}

.campaign_spring h2{
	color: #4f4747;
	font-size:4.4em;
	padding:8px 0 0;
	font-weight:600;
	letter-spacing: 0.2em;
	border: 8px #ee8aac solid;
	border-radius: 5em;
	background-color: #fff;
}
.campaign_h2sub{
	margin: 50px auto 10px;
	text-align: center;
	color: #ee8aac;
	font-size:1.8em;
	font-weight:600;
	padding:10px;
	background-color: #dcf0fb;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.campaign_h2sub span{
	position:relative;
	display:inline-block;
	padding:0 100px;
}
.campaign_h2sub span::before,.campaign_h2sub span::after{
	position: absolute;
	content:"";
	top:0;
	display: block;
	width:100px;
	height:100%;
	background-image: url("../images/lesson_title_frame.webp");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
.campaign_h2sub span::before{
	left:0;
}
.campaign_h2sub span::after{
	right:0;
	transform: scale(-1,1);
}


.campaign_spr{
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap:20px;
	padding:0 0 70px;
}
.campaign_spr_inner{
	width:calc((100% - 40px) / 3);
	margin:10px 0 0;
}

.campaign_spr_inner img{
}
.campaign_spr_inner p{
	padding:10px 20px 20px;
	color: #3a3a3a;
	font-size:14px;
}


/*-----------Campaign 本科---------------*/

.campaign_honka_area{
	background-image: url("../images/newcampaign_bk.webp");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.campaign_honka_box{
	padding:60px 30px 40px;
}

.campaign_honka_box h2{
	line-height:0;
	margin:0 auto 30px;
	max-width:1100px;
}

.campaign_honka{
	margin:0 auto 40px;
	max-width:1360px;
	background-color:rgba(255,255,255,.15);
}

.campaign_honka_inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding:20px 0;
}
.campaign_honka_inner div{
	width:49%;
}



/*-----------Campaign Amazon---------------*/
.campaign_amazon{
	margin: auto;
	max-width:1360px;
	background-color:rgba(255,255,255,.15);
}
.campaign_amazon_inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding:15px 3.5%;
	line-height:0;
}

.campaign_amazon_innertitle{
	width:100%;
	background-color:#d94e84;
	padding:3px 20px;
}
.campaign_amazon_innertitle img{
	max-width:230px;
}
.campaign_amazon_innertext{
	width:40%;
	margin: auto 0;
}
.campaign_amazon_innerimg{
	width:55%;
	padding:15px 0 15px 50px;
}

.campaign_note{
	margin: auto;
	max-width:1360px;
	padding-top:15px;
	text-align:left;
	font-size:14px;
}


/*-----------受講までの流れ----------------*/

.flow{
	padding: 100px 0 60px;
}

.flow_box{
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding:0 20px;
}
.flow_box h2{
	color: #ee8aac;
	font-size: 4.2em;
    letter-spacing: 0.06em;
	font-weight:600;
}

.flow_inner{
	position: relative;
	max-width: 900px;
	margin:60px auto 100px;
	border:4px solid #ee8aac;
	border-radius: 25px;
	padding:20px;
}
.flow_inner_num{
	position: absolute;
	display: inline-block;
	width:220px;
	background-color: #fff;
	top:-1em;
	left:0;
	right:0;
	margin: auto;
	color:#ee8aac;
	font-size: 2.5em;
	font-weight:600;
	font-family: serif;
}
.flow_inner h3{
	color: #4f4747;
	font-size: 1.8em;
	font-weight:600;
}

.flow_inner_img{
	display: flex;
	flex-wrap: wrap;
	width:140px;
	height:140px;
	margin: auto;
	padding:20px;
	border:15px solid rgba(238,138,172,.3);
	border-radius: 50%;
	margin-bottom: 15px;
}
.flow_inner_img.step_1{
	padding:10px 20px 20px;
}
.flow_inner_img.step_2{
	padding:20px 20px 15px;
}
.flow_inner_img.step_3{
	padding:12px 20px 20px;
}

.flow_inner_img img{
	margin: auto;
}

.flow_inner_links{

}
.flow_inner_links a{
	display: block;
	position: relative;
	background-color:#ee8aac;
	color:#fff;
	font-size: 1.2em;
	font-weight:600;
	border: #ee8aac 3px solid;
	border-radius: 3em;
	padding:.5em 0 .4em;
	letter-spacing: 0.02em;
	margin-bottom: 13px;
	transition: .2s;
}
.flow_inner_links a::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right: 15px;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
    z-index: 1;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
	transition: .2s;
}
@media screen and (min-width: 768px) {
	.flow_inner_links a:hover{
		color:#ee8aac;
		background-color:rgba(255,255,255,0);
	}
	.flow_inner_links a:hover::after {
		border-color:#ee8aac;
	}
}



/*-----------はじめてでも大丈夫---------------*/

.first_area{
	background-image: url("../images/first_bk.webp");
	background-position:top center;
	background-size: cover;
}
.first_box{
	padding:80px 30px;
}

.first_main{
	margin: auto;
	max-width:1100px;
}
.first_title h2{
	margin: auto;
	max-width:700px;
}

.first_img{
	padding:30px 0;
}

.first_link_text{
	display: flex;
	flex-wrap: wrap;
	margin: auto;
	max-width:800px;
}
.first_link_textimg{
	position: relative;
    overflow: hidden;
	width:50%;
}
.first_link_textimg img {
    position: absolute;
    top:0;
    left: 50%;
    transform: translateX(-50%);
}
.first_link_textcomment{
	width:50%;
}
.first_link_textcomment > div:nth-child(1){
	text-align: left;
	padding:60px 0 10px;
}
.first_link_textcomment > div:nth-child(1) img{
	transform: rotate(-5deg) translateX(-10%);
}
.first_link_textcomment > div:nth-child(2){
	padding: 35px 0 20px 30px;
}
.first_link_textcomment > div:nth-child(2) p{
	color: #4f4747;
    font-size:24px;
	line-height: 1.55em;
    letter-spacing: 0.07em;
    font-weight: 600;
	padding-bottom:15px;
}
.first_link_textcomment > div:nth-child(2) span{
	font-size:140%;
	font-weight:700;
	background:linear-gradient(to bottom,rgba(255,255,255,0) 47%,#ffee00 47%,#ffee00 80%,rgba(255,255,255,0) 80%);
}


.first_link a{
	display: block;
	position: relative;
	margin: auto;
	width:100%;
	max-width:790px;
	background-color:#ec88aa;
	color:#fff;
	font-size:30px;
	font-weight:600;
	border: #ec88aa 3px solid;
	border-radius: 3em;
	padding:.2em 0 .18em;
	letter-spacing: 0.02em;
	margin-bottom: 13px;
	transition: .2s;
}
.first_link a::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right:20px;
    width:15px;
    height:15px;
    transform: rotate(45deg);
    z-index: 1;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
	transition: .2s;
}
@media screen and (min-width: 768px) {
	.first_link a:hover{
		color:#ee8aac;
		background-color:rgba(255,255,255,0);
	}
	.first_link a:hover::after {
		border-color:#ee8aac;
	}
}



/*-----------ガイダンス---------------*/

.orientation_area{
	background-color:#f7f7f7;
}

.orientation_box{
	width: 100%;
	max-width: 1380px;
	margin: auto;
	padding:100px 40px;
}

.orientation_title h2{
	color:#ec88aa;
	font-size: 2.6em;
    letter-spacing: 0.06em;
	font-weight:600;
}
.orientation_titlesub{
	padding: 10px 0;
    text-align: center;
    color: #4f4747;
    font-weight: 600;
	letter-spacing: 0.04em;
}

.orientation_wrap{
	margin: 10px auto 0;
	display: flex;
	flex-wrap: wrap;
	gap:0 20px;
	padding:0 0 15px;
  justify-content: center;
}

.orientation_inner{
	width:calc((100% - 40px) / 3);
}
.orientation_inner a{
	transition: .2s;
}

@media screen and (min-width: 768px){
	.orientation_inner a:hover{
		opacity: .7;
	}
}


/*-----------ガイダンス---------------*/
.guidance{
	padding: 0;
}

.guidance_box{
	width: 100%;
	max-width: 1380px;
	margin: auto;
	padding:50px 40px 0;
}

.guidance_box h2{
	color:#ec88aa;
	font-size: 2.6em;
    letter-spacing: 0.06em;
	font-weight:600;
}

.guidance_wrap{
	margin: 10px auto 0;
	display: flex;
	flex-wrap: wrap;
	gap:0 20px;
	padding:0 0 15px;
	justify-content:flex-start;
}
.guidance_inner{
	width:calc((100% - 40px) / 3);
	margin:10px 0 30px;
	display: flex;
	flex-wrap: wrap;
}

.guidance_inner_img{
	margin: 0;
	width: 100%;
}
.guidance_inner_text{
	margin:0;
	width: 100%;
	padding:10px 5px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.guidance_inner_text span{
	display: block;
	width:100%;
	padding-bottom: 10px;
	color: #4f4747;
}

.guidance_inner a{
	transition: .2s;
}

.guidance_inner a.guidance_btn{
	display: block;
    width: 100%;
    margin: auto auto 0;
    position: relative;
    text-align: center;
    font-size: 110%;
    padding: 8px;
    font-weight: bold;
    color: #002b69;
    border: solid 3px #002b69;
    transition: .2s;
}
.guidance_inner a.guidance_btn::after{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right: 15px;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
    z-index: 1;
    border-top: 3px solid #002b69;
    border-right: 3px solid #002b69;
}
.guidance_inner.gray a{
	pointer-events:none;
}
.guidance_inner a img{
	transition: .2s;
}

.guidance_inner.gray a.guidance_btn{
	color:#1a1a1a;
	background: #ddd;
	border: solid 3px #ddd;
}
.guidance_inner.gray a.guidance_btn::after{
	content: none;
}


@media screen and (min-width: 768px){
	.guidance_inner a img:hover{
		opacity: .7;
	}
	.guidance_inner.gray a img:hover{
		opacity: 1;
	}

	.guidance_inner a.guidance_btn:hover {
		background-color: #002b69;
		color: #fff;
	}
	.guidance_inner a.guidance_btn:hover::after{
		border-top: 3px solid #fff;
    	border-right: 3px solid #fff;
	}
	.guidance_inner.gray a.guidance_btn:hover{
		color:#1a1a1a;
		background: #ddd;
	}
}



/*-----------校舎検索----------------*/

.map_box{
	padding:100px 0 100px;
	background: url("../images/searchmap-bg.svg") no-repeat center center / cover;
}

.map_box h2 {
    color: #fff;
    font-size:2em;
    letter-spacing: 0.06em;
    font-weight:700;
}

.map_btn_area{
	padding:20px 20px 0;
	display:flex;
	flex-wrap: wrap;
	margin:auto;
	max-width:840px;
	gap:30px;
}

.map_btn_area a{
	position:relative;
	display:block;
	width:calc((100% - 30px)/ 2);
	border:#fff solid 2px;
	padding:10px 0;
	letter-spacing:0.05em;
	font-size: 110%;
    font-weight: bold;
    color: #fff;
    transition: .2s;
}
.map_btn_area a::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right: 15px;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
    z-index: 1;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
	transition: .2s;
}


@media screen and (min-width: 768px){
	.map_btn_area a:hover{
		background-color:#fff;
		color:#ff7f8e;
	}
	.map_btn_area a:hover::after{
		border-color:#ff7f8e;
	}
}