@charset"UTF-8";

/*! minireset.css v0.0.2 | MIT License | github.com/jgthms/minireset.css */
html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{-webkit-box-sizing:border-box;box-sizing:border-box}*,*:before,*:after{-webkit-box-sizing:inherit;box-sizing:inherit}img,embed,object,audio,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}



/********************************************
  以下、LP用CSS
 */
/*preload*/
body::after{
    position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
    content:url(../img/header_footer/KVillageTokyo_logo.svg) url(../img/header_footer/header_btn_form_large.svg) url(../img/header_footer/header_btn_form_small.svg)  url(../img/main_feature/main_feature_header.svg) url(../img/main_feature/main_feature_area.svg) url(../img/main_feature/main_feature_point.svg) url(../img/main_feature/main_feature_balloon.svg) url(../img/main_feature/main_feature_sub_header.svg)url(../img/contact/contact_btn_form.svg) ;
}

/*ベースの設定*/
html {
  width: 100%;
  min-width:320px;

  font-size: 10px;
  line-height: 1.5em;
}

body {
  color: #4D4D4D;
  font-size: 20px;
  line-height: 1.5em;
  font-family: "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , Avenir , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , sans-serif;

  -webkit-text-size-adjust: 100%;
  font-size-adjust: 100%;
}

section {
  overflow: hidden;
}

img {
  display: block;
  vertical-align: top;
/*UIE10用*/
  border: 0;
}

span {
  display: inline-block;
}

/*form*/
input, textarea {
  font-size: 16px;
  padding:3px;
}

/*アンカー*/
a, a:visited {
  color: blue;
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: underline;
}

/*丸ゴシック*/
.marugoshic {
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO", "メイリオ" , Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/*明朝体*/
.mincho {
  font-family: "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , Garamond , "Times New Roman" , serif;
}

/*イメージ表示位置*/
.img-pos-r {
  margin-left: auto;
  margin-right: 0;
}
.img-pos-c {
  margin-left: auto;
  margin-right: auto;
}
.img-pos-l {
  margin-left: 0;
  margin-right: auto;
}

/*  フロート*/
.flt_box {  zoom: 1;}
.flt_box::after, .fltBox::before {  content: '';  display: table;}
.flt_box::after {  clear: both;}

/*flex*/
.flex_box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.item_ctr {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

/*句読点関係*/
.left_parenthesis {
  margin-left: -0.55em;
}
.right_parenthesis {
  margin-right: -0.55em;
}
.jp_comma,
.jp_period {
  margin-right: -0.66em;
}

.tac {
  text-align: center;
}

/*SP改行用*/
.br_sp {
  display: none;
}

/********************************************
  共通
 */
#wrap {
  display: none;
}

 /**/
.contents_bloc {
  max-width: 980px;
  padding: 1px 10px;
  margin: 0 auto;
}

/*マンガ*/
.manga_bloc {
  max-width: 980px;
  margin: 0.5em auto;
  padding: 0 10px;
}
.manga_bloc p {
  padding: 0.5em 0;
}
.manga_bloc img {
  margin: auto;
}
/*マンガSP用*/
.manga_bloc_sp p {
  padding: 1.15vw 0;
}
.manga_bloc_sp img {
  margin: auto;
  border: 1vw solid #2A0A12;
}


/********************************************
  フッター                                    */
footer {
  background-color: #2660AD;
  color: #FFF;
  font-size: 22px;
  line-height: 1.25em;
  text-align: center;
}
#footer_bloc {
  padding: 3% 0;
}
.footer_logo {
  width: 25%;
  margin: 0 auto 5%;
}

/********************************************
  ヘッダー                                    */
header {
  position: relative;
  z-index: 200;
  border-top: 18px solid #2660AD;
}
#header_box.contents_bloc {
  margin: 0 auto;
  padding: 0 10px;
  min-height: 96.313px;
}

/*ヘッダーロゴ*/
.logo_bloc {
  width: 39%;
}
#logo {
  margin: 2.8% 0 0 8.2%;
}

/*ヘッダーボタン*/
.header_btn_bloc {
  width: 28.9%;
  margin: -1px 0 0;
  background-color: #2660AD;
  border-radius: 0 0 12px 12px / 0 0 12px 12px;
}
.header_btn_inner {
  position: relative;
  width: 76.6%;
  margin: auto;
  padding: 3% 0;
}

/*スクロールしたら表示されるナビボタン*/
#nav_fix_box {
  /*display: none;*/

  position: fixed;
  z-index: 999;

  width: 100%;
  max-width: 980px;
  height: 0;
  top: 0;

  left: 0;
  right: 0;
  margin: auto;
}

.nav_fix {
  position: relative;
  margin: 0 10px 0 auto;
  width: 11%;
}
.nav_btn_bloc {
  float: left;
  width: 100%;
  -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
          filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
}
.nav_btn_inner {
  width: 100%;
  height: 100%;
  padding: 0 2px 2px;
}

/********************************************
  各項目のヘッダー                              */
/**/
.header_box {
  background: #376AB3 url('../img/header_footer/common_header_bgi.svg') repeat-x 0 0;
}
.header_box > .contents_bloc {
  padding: 0 10px;
}
.header_line_top,
.header_line_top {
  /*position: relative;*/
  margin: 0 auto;
  padding: 0 10px;
}


/********************************************
  逆三角形                                    */
.marka_box{
  position: relative;
}
.iTriangle {
  position: relative;
  z-index: 100;
  display: block !important;
  margin: 0 auto;
  width: 3.5em;
  height: 3.5em;
  font-size: 40px;
}
#iTriangle1 {
  margin: 1.15% auto 2.25%;
}
#iTriangle2 {
  margin: 2% auto 0%;
}
#iTriangle3 {
  margin: 1.15% auto 2.25%;
}
#iTriangle4 {
  margin: 1.15% auto 2.25%;
}
#iTriangle5 {
  margin: 0 auto 1.8%;
}

/*noscript用*/
.iTriangleNoJS {
  position: absolute;
  width: 0;
  height: 0;
  top: 15.5%;
  left: 0;
  right: 0;
  margin: auto;

  border: 4.4em solid transparent;
  border-top: 2.15em solid #00477E;
  border-bottom: 0;
  font-size: 40px;
}


/********************************************
  お問い合わせ
*/
.contact_bloc {
  position: relative;

  width: 61.2%;
  margin: 4.1% auto 3.3%;
}

/*ボタン*/
.contact_btn_bloc {
  margin: 0 0 0 23.3%;
  padding: 3.5% 0 14.2%;
}
.contact_5th_bloc {
  margin: 0 auto 8.2%;
}
.contact_btn {
  display: block;
  width: 100%;
  min-height: 130px;
  padding: 32.5px 0;
  background-color: #1CB653;
  border-radius: 12px;

  background: #0076b2;
  background: -webkit-linear-gradient(top, #0076b2 0%,#00457a 50%,#00477e 51%,#00477e 100%);
  background: -webkit-gradient(linear, left top, left bottom, from(#0076b2),color-stop(50%, #00457a),color-stop(51%, #00477e),to(#00477e));
  background: -o-linear-gradient(top, #0076b2 0%,#00457a 50%,#00477e 51%,#00477e 100%);
  background: linear-gradient(to bottom, #0076b2 0%,#00457a 50%,#00477e 51%,#00477e 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0076b2', endColorstr='#00477e',GradientType=0 );
}
.contact_btn_inner {
  width: 77%;
  margin: 0 0 0 11.2%;
}

/*イラスト（フォームヘッダーのイラストと共通）*/
.contact_illust{
  position: absolute;
  z-index: 1;
  bottom: 0;
  height: 0;

  width: 38.6%;
  padding-top: 40%;
  bottom: 0;
  left: -3.3%;
  background: url('../img/contact/contact_illust.png') no-repeat 0 0;
  background-size: 100% auto;
  background-position: left bottom;
}


/********************************************
  メインフィーチャー                           */
.main_feature_bloc {
  margin: 0 auto 1.4%;
  min-height: 789.938px;
}

/*フィーチャー内容*/
.mf_contents_bloc {
  position: relative;
  max-width: 980px;
  margin: -1px auto;
  padding: 0 10px;
}

/*見出し*/
.mf_header_bloc {
  width: 90.93%;
  min-height: 171.078px;
  margin: 1.3% 13% 1.8% 2.36%;
}
.mf_header_inner {
  width: 100%;
}
.mf_one_coin {
  display: block;
  position: relative;
  z-index: 2;
  width: 19.6%;
}
.korean_school {
  overflow: hidden;
  display: block;
  width: 79.1%;
}

/**/
.main_feature_inner {
  position: relative;
}
.mf_school_info_bloc {
  width: 49.7%;
  margin: 0 0 .8% .45%;
}
.mf_student_number_bloc {
  width: 51%;
  margin: 0 0 0 17.45%;
}
.mf_student_number,
.mf_number_unit {
  color: #D9383F;
  font-size: 32px;
  font-weight: bold;
  line-height: 1.15;
  text-align: center;
}
.mf_student {
  font-size: 24px;
}
.mf_number {
  font-size: 50px;
  font-weight: bold;
  font-family: "Noto Sans Japanese", sans-serif;
}


.mf_school_point_bloc {
  width: 42.41%;
  margin: 0 0 0 .45%;
}

/*イラスト*/
.mf_illust_bloc {
  position: absolute;
  width: 56.55%;
  height:0;
  padding-top: 60%;
  top: -1.3%;
  right: 3.5%;

  font-size: 40px;
  background: url('../img/main_feature/main_feature_illust.png') no-repeat 0 0;
  background-position: right bottom;
  background-size: 100% auto;
}
.mf_illust_balloon_inner {
  overflow: hidden;
  position: absolute;
  width: 54.4%;
  top: -.1%;
  right: -7.2%;
}

.mf_sub_header_bloc {
  overflow: hidden;
  width: 98%;
  min-height: 129.81px;
  margin: auto;
  padding: 4.2% 0 4.5%;

}

/********************************************
  お悩み                                     */
.trouble_header_box {
  background: #E5E5E6;
}
.trouble_header_bloc {
  position: relative;
  width: 69%;
  margin: 0 auto 3em;
  padding: 2.4% 0 2.8%;

}
.trouble_header_bloc::before {
  position: absolute;
  content: '';
  z-index: -1;
  display: block;

  left: 0;
  right: 0;
  bottom: -1.2em;
  margin: auto;

  width: 0;
  height: 0;
  font-size: 40px;
  bottom: -1.42em;
  border: 2.8em solid transparent;
  border-top: 1.45em solid #E5E5E6;
  border-bottom: 0;
}

.trouble_bloc {
  position: relative;
  width: 94.4%;
  padding: .8% 2.7% 4.5% 3.7%;
  margin: .75% auto 1.5% 3.2%;

  background-color: #FDEFE9;
  -webkit-box-shadow: 3px 3px 4px rgba(0, 0, 0, .35);
          box-shadow: 3px 3px 4px rgba(0, 0, 0, .35);
}
.trouble_bloc > dl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;

  width: 100%;
  margin: 4% 0 0;
}

.t_checkbox {
  position: relative;
  font-size: 40px;

  height: 1.2em;
  width: 1.2em;

  margin: 0 .8em 0 0;

  background-color: #FFF;
  border: 2px solid #2660AD;
}

.check1_inner, .check2_inner, .check3_inner,
.icon1, .icon2, .icon3 {
  position: absolute;
  font-size: 40px;

  display: block;

  width: 1.45em;
  height: 1.36em;
}

.check1_inner, .check2_inner, .check3_inner {
  top: -.575em;
  left: 0;
  overflow: hidden;
}
.icon1, .icon2, .icon3 {
  top: 0;
  left: 0;
  background: url(../img/trouble/trouble_check.svg) no-repeat 0 0;
  background-size: 1.45em 1.36em;
}

.t_checkbox + dd {
  overflow: hidden;
  margin: 0;
  padding: 0 0 .11em .19em;

  color:#808080;
  font-size: 41.4px;
  line-height: 1.5em;
  letter-spacing: -2px;

  width: 89.75%;
  width: calc(100% - 2em);
}
.dotted_line_red {
  display: inline;
  background: #D9383F; /* Old browsers */
  /*iOS safariでぼやけてしまうのでSPは下記に変更*/
  background:
   -webkit-linear-gradient(left, #D9383F, #D9383F 8px, transparent 0px, transparent 6px);
  background:
   -o-linear-gradient(left, #D9383F, #D9383F 8px, transparent 0px, transparent 6px);
  background:
   linear-gradient(90deg, #D9383F, #D9383F 8px, transparent 0px, transparent 6px);
  background-size: 14px 2px;
  background-position: left 3px bottom;
  background-repeat: repeat-x;
  padding: 0 0 1.75% 0;
}


/********************************************
  レッスン
*/
.lesson_header_bloc {
  width: 39.7%;
  margin: auto;
  padding: 4.8% 0 4%;
}

/*各ブロック*/
.lesson_bloc:not(:last-of-type) {
  margin: 7% 0;
}
.lesson_bloc:last-of-type {
  margin: 7% 0 7.6%;
}
/*サブヘッダー*/
.lesson_sub_header_bloc {
  width: 41%;
  margin: 0 auto 2.3%;
}

.lesson_inner {
  width: 89.9%;
  margin: 0 0 0 6.1%;

}
.recommended_class {
    width: 55.4%;
    margin: 0 0 3.5% 21.2%;
}
.recommended_private {
    width: 91.83%;
    margin: 0 0 3.5% 2.2%;
}

.lesson_point > li {
  position: relative;
  line-height: 1.4em;
  margin: 0 0 .21em 1em;
}
.lesson_point > li::before {
  position: absolute;
  content: '・';
  top: 0;
  left: -1em;
}

.lesson_arrow_bloc {
  width: 24.7%;
  margin: auto;
}

/********************************************
  受講生の声                                  */
.student_voice_header_bloc {
  width: 33.4%;
  margin: auto;
  padding: 4.2% 0 4%;
}

.student_voice_list {
  width: 96.7%;
  margin: 0 auto 0 1.58%;
  padding: 7.4% 0 8%;
}
.student_voice_bloc:not(:last-of-type) {
  margin: 0 0 7.5%;
}
.student_data_bloc {
  width: 100%;
}

.student_photo {
  width: 17.8%;
  padding: 13px 0 0 7px;
}
.student_data {
  width: 82.2%;
  padding: 0 0 0 4%;
}

.student_voice_sub_header_bloc {
  padding: 0 0 0 7px;
  margin: 0 0 .5%;
}
.student_voice_header {
  color: #D9383F;
  font-size: 40.2px;
  font-weight: bold;
  line-height: 1.5;
}

.student_lesson_data_caption {
  color: #2660AD;
  font-size: 27px;
  font-weight: bold;
  line-height: 1.4;
}
.student_lesson_data {
  width: 48.7%;
}
.student_lesson_data th,
.student_lesson_data td {
  color: #2660AD;
  font-size: 25px;
  font-weight: normal;
  line-height: 1;
  border-bottom: 1px solid #2660AD;
  padding: 9px 0;
}
.student_lesson_data th {
  width: 54.5%;
}
.student_lesson_data td {
  width: 45.5%;
}
.student_voice {
  color: #4D4D4D;
  font-size: 28.4px;
  line-height: 1.5;
}

/*受講生写真*/
.student1_photo,
.student2_photo,
.student3_photo,
.student4_photo {
  display: block;
  width: 100%;
  height: 0;
  padding-top: 100%;
  margin: 0px 0 6.7%;
}
.student1_photo {
  background: url('../img/student_voice/student1_photo.jpg') no-repeat 0 0;
  background-size: 100% auto;
  background-position: left top;
}
.student2_photo {
  background: url('../img/student_voice/student2_photo.jpg') no-repeat 0 0;
  background-size: 100% auto;
  background-position: left top;
}
.student3_photo {
  background: url('../img/student_voice/student3_photo.jpg') no-repeat 0 0;
  background-size: 100% auto;
  background-position: left top;
}
.student4_photo {
  background: url('../img/student_voice/student4_photo.jpg') no-repeat 0 0;
  background-size: 100% auto;
  background-position: left top;
}

/*受講生の声吹き出し*/
.student_voice_balloon_bloc {
  position: relative;
  z-index: 2;
  padding: 4.5% 1.2% 4.5% 3%;
  margin: 29px 0 0 .2%;
  background-color: #FFF;
  border: 3px solid #D9383F;
  border-radius: 1.6em;
}
.student_voice_balloon_bloc::before,
.student_voice_balloon_bloc::after {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
}
.student_voice_balloon_bloc::before {
  z-index: -1;
  top: -34px;
  left: 74px;
  border: 16px solid transparent;
  border-bottom: 34px solid #D9383F;
  border-top: 0;
}
.student_voice_balloon_bloc::after {
  top: -26px;
  left: 78px;
  border: 12px solid transparent;
  border-bottom: 27px solid #FFF;
  border-top: 0;
}

.student_voice_header,
.student_lesson_data_caption,
.student_lesson_data th,
.student_lesson_data td {
  font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", HG丸ｺﾞｼｯｸM-PRO, HGMaruGothicMPRO, 'M PLUS Rounded 1c', sans-serif;
}

@media screen and (max-width: 650px){
.content-sp {
    display: block;
}
.content-pc {
    display: none;
}
}


@media screen and (min-width: 650px){
  .content-sp {
    display: none;
}
.content-pc {
    display: block;
}
}
.aligncenter{
  text-align: center;
  margin: 0 auto;
}