@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*==========================================================================*/
h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, th, td, pre, address, li, dt, dd { font-size: 2rem; -webkit-text-size-adjust: none; font-weight:400;}
*,::before,::after{box-sizing:border-box;outline: none;}
img {vertical-align: middle;max-width: 100%;flex-shrink: 0;height: auto;}
select { visibility: visible !important; }
a{transition:all ease 0.3s;text-decoration:none;color: var(--txt);}
a[href^="tel:"] {word-break: keep-all;}
ol li{list-style: decimal;}

/*==========================================================================*/
/*                             Common-Setting                               */
/*==========================================================================*/
:root {
  --txt: #000000;
  --mcolor: #000000;
  --scolor: #00b0f0;
  --container: 1200px;

  --gray: #9fa0a0;
  --blue: #001e50;
  --red: red;
  --f-main: "PorscheNextJP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
  --f-PORHead: "PorscheNextJP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

html{background:#fff;font-size: 62.5%;}
body{margin: 0;padding: 0;-webkit-text-size-adjust:none;min-width:32rem;color:var(--txt);background-color: #fff;font-family: var(--f-main);font-weight: 400;font-size: 1.6rem;line-height: 1.4;-webkit-font-smoothing: antialiased;}
input, button, textarea, select {font-family: inherit;}
table {width: 100%}
select, input, button, textarea {font-family: inherit;font-size: 100%;}
h1, h2, h3, h4, h5, h6, b, strong, .bold {font-weight: 700;}
h1,h2,h3,h4,h5,h6{line-height: 1.4;}
p,dd,dt,li,th,td,address{line-height: 1.45;letter-spacing: 0;}
p{margin: 0 0 1.5em;}
p:last-child{margin-bottom: 0}

.bold{font-weight: bold;}
.f-normal{font-weight: normal;}
.left{text-align:left}
.right{text-align: right;}
.auto{margin-left: auto; margin-right: auto;}
.link{text-decoration: underline;color: var(--mcolor);}

.mb10{margin-bottom:1rem}
.mb15{margin-bottom:1.5rem}
.mb20{margin-bottom:2rem}
.mb30{margin-bottom:3rem}

#wrapper{overflow:hidden;margin:0 auto}
.inner{width: var(--container);margin:0 auto;position:relative;max-width: 100%;padding: 0 15px;}
@media screen and (max-width: 768px) {.inner{padding: 0 1.5rem;}}
.en{font-family: var(--f-PORHead);}
.bold{font-weight: bold;}
.color1{color:var(--txt) !important}

.article a {
  text-decoration: underline;
}
.article a:hover {
  text-decoration: none;
}

/*============= HEADER ==============*/
header{position: relative; z-index:9;}
.h_box{width:100%;position: absolute;top: 8rem;left: 0;}
#logo{width: fit-content;position: relative;}

/*============= MAIN ==============*/
main{position: relative;z-index: 2;}

.btn a{font-size: 36px;font-weight: bold;text-align: center;color: #FFF;display: flex;justify-content: center;align-items: center;background-color: var(--mcolor);width: 687px;height: 105px;max-width: 100%;border-radius: 999px;letter-spacing: -.1rem;}
.btn.center a{margin-left: auto;margin-right: auto;}

/* Main Visual */
.mv { position: relative; width: 100%; overflow: hidden; }

.f48{font-size: 4.8rem;}
.f40{font-size: 4.0rem;}
.f35{font-size: 3.5rem;}
.f34{font-size: 3.4rem;}
.f31{font-size: 3.1rem;}
.f30{font-size: 3rem;}
.f28{font-size: 2.8rem;}
.f27{font-size: 2.7rem;}
.f26{font-size: 2.6rem;}
.f24{font-size: 2.4rem;}
.f22{font-size: 2.2rem;}
.f18{font-size: 1.8rem;}
.f17{font-size: 1.7rem;}
.f16{font-size: 1.6rem;}
.f15{font-size: 1.5rem;}
.f12{font-size: 1.2rem;}
.f10{font-size: 1rem;}
.f9{font-size: 0.9rem;}
.fw200{font-weight: 200;}
.fw300{font-weight: 300;}
.fw500{font-weight: 500;}
h2,h3{font-family: var(--f-PORHead);}
.txt_u{text-decoration: underline;text-underline-offset: 2px;}

/*sec01*/
.sec01{padding: 8rem 0 15rem;}
.sec01_tt{font-size:8rem;font-weight: bold;line-height: 1.3;margin-bottom: 5.2rem;letter-spacing: 0.03em;text-align: center;}
.sec01 .hero-subtext01 {font-weight: 800;font-size: 4.2rem;display: block;}
.sec01 .hero-subtext02 {font-weight: 800;font-size: 6.6rem;display: block;}

.sec01_img{margin-bottom: 10.2rem;}
.sec01_desc{margin-bottom: 15rem;text-align: center;}
.sec01_desc p{font-size: 3.4rem;letter-spacing: 0.08em;font-weight: bold;line-height: 1.599;}
.sec_title {display: block;text-align: center;margin: 0rem 0 6rem;border-top: 2px solid #dadbe2;border-bottom: 2px solid #dadbe2;font-family: var(--f-main);font-size: 4rem;letter-spacing: 0.23em;padding: 1rem 0;}

/* --- テーブル --- */
.sec_table01{width:100%;max-width:var(--container);margin:0 auto;border-collapse:collapse;margin-bottom:9rem;}
.sec_table01 th,.sec_table01 td{padding:2.0rem;text-align:left;vertical-align:top;border:none;font-weight:bold;font-size:2.6rem;line-height:1.154;}
.sec_table01 th{width:170px;font-weight:700;border-right:1px solid #dadbe2;text-align:justify;text-align-last:justify;padding:0rem 3rem 2rem 0rem;}
.sec_table01 tr:nth-child(3) th{letter-spacing:-0.03em;}
.sec_table01 td{padding:0rem 0rem 2rem 2rem;letter-spacing:0.01em;}
.sec_table01 td small{font-size:2rem;margin-top:0.5rem;font-weight:400;letter-spacing:-0.02em;}
.sec_table01 span{font-size:2rem;}
.sec_table02 th,.sec_table02 td{padding:1.2rem 0;font-family:var(--f-main);border-bottom:1px solid #000;border-top:none;border-right:none;border-left:none;vertical-align:middle;}
.sec_table02 tr:first-child th,.sec_table02 tr:first-child td{border-top:1px solid #000;}
.sec_table02{width:calc(100% + 6.0rem);margin-left:-3.0rem;border-collapse:separate;border-spacing:3.0rem 0;}
.sec_table02 th{width:50%;text-align:left;padding-left:1.0rem;font-weight:normal;letter-spacing:0.5em;white-space:nowrap;}
.sec_table02 td{width:100%;font-weight:400;letter-spacing:0.03em;display:inline-block;padding-left:25%;}
.sec02 .sec_table01{margin-bottom:6rem;}
.sec02 .sec_table01 th::after{content:none;}
.sec02 .sec_table01 th{padding:0rem 2rem 0rem 0rem;letter-spacing:0.5em;width:25%;}
.sec02 .sec_table01 td{padding:0rem 0rem 0rem 2rem;letter-spacing:0.03em;line-height:1.346;}
.sec02 .sec_table01 span{font-size:2.6rem;letter-spacing:0.15em;}
.sec02 .sec_table01 span a {border-bottom: 1px solid;}
.sec02 .sec_table01 span a:hover {border-bottom: none;}
.sec02 .sec02_img{margin-bottom:5.5rem;}

/*お申し込みボタン*/
.btn_area{text-align:center;}
.btn_entry{display:inline-block;background-color:#177AD8;color:#fff;font-family:var(--f-main);font-size:3.6rem;font-weight:bold;padding:1.5rem 4.0rem;text-decoration:none;border-radius:10px;transition:opacity 0.3s ease;letter-spacing:0.1em;}
.btn_entry:hover{opacity:0.8;color:#fff;}
.sec_notes{max-width:var(--container);margin:7rem auto 0;padding:0 2.0rem;}

/*注意事項*/
.notes_title{font-family:var(--f-main);font-size:2.7rem;margin-bottom:1.5rem;text-align:left;font-weight:normal;line-height:0.926;}
.notes_list{list-style:none;padding:0;margin:0;}
.notes_list li{font-family:var(--f-main);font-size:2.2rem;padding-left:1.2em;text-indent:-1.2em;position:relative;line-height:1.364;letter-spacing:0.03em;}
.notes_list li::before{content:"※";}

.sec02 {padding: 0rem 0 9.5rem;}
.sec02_tt1 {font-size: 2.8rem;font-weight: bold;margin-bottom: 1rem;}
.sec02_tt1 .en{font-size: 107.143%;letter-spacing: 0.08rem;}
.sec02_tt2 {font-size: 2.5rem;font-weight: bold;margin-bottom: 2.7rem;}
.sec02_tt2 .en{font-size: 112%;}
.sec02_des{letter-spacing: -.05rem;line-height: 1.5;}

.sec03 .sec03-contents {background-color: #DADBE2; border-radius: 10px;padding: 6rem 5rem;margin-bottom: 11.5rem;}
.sec03 h2 {text-align: center;margin-bottom: 6rem;font-size: 3.5rem;letter-spacing: 0.25em;}
.sec03 h2 span.sec03-int {display: block;font-size: 2.5rem;font-weight: normal;margin-bottom: 3rem;letter-spacing: 0.2em;}
.sec03 h2 span.f-normal {font-size: 3rem;letter-spacing: 0.25em;}
.sec03 .sec03_txt1 {line-height: 2.043;font-size: 2.3rem;}
.sec03 .sec03_txt2 {font-weight: bold;font-size: 2rem;}
.sec03 .sec03_txt2 a {border-bottom: 1px solid;}
.sec03 .sec03_txt2 a:hover {border-bottom: none;}
.sec03 .sec03_img {margin-bottom: 5.5rem;}


.sec04 {padding: 7.5rem 0 3.2rem;background-color: var(--mcolor);}
.sec04 *{color: #FFF;}
.sec04_contents {margin-bottom: 10rem;}
.sec04_tt1{display:flex;align-items:center;color:#fff;font-family:var(--f-main);font-size:4.0rem;letter-spacing:0.08em;font-weight:700;text-align:left;width:100%;margin-bottom:6.5rem;}
.sec04_tt1::after{content:"";flex:1;height:3px;background-color:#fff;margin-left:10px;}

.sec04_txt1 {font-size: 2rem;margin-bottom: 3.5rem;letter-spacing: 0.15em;font-family: var(--f-PORHead);line-height: 1.5;}
.sec04_txt2 {font-size: 1.5rem;margin-bottom: 2rem;letter-spacing: 0.1em;font-family: var(--f-PORHead);line-height: 1.333;}
.sec04_txt3 {font-size: 1.5rem;margin-bottom: 4rem;letter-spacing: 0.1em;font-family: var(--f-PORHead);line-height: 1.333;}
.sec04_access {font-size: 1.9rem;margin-bottom: 1.9rem;letter-spacing: 0.1em;font-family: var(--f-PORHead);line-height: 1.333;display: inline;}
.sec04_access a {border-bottom:1px solid;}
.sec04_access a:hover {border-bottom:none;}
.sec04 .sec04_img {margin-bottom: 5.5rem;}

.sec04_add {margin-bottom: -0.2rem;}
.sec04_add .en{font-size: 107%;}
.sec04_tt3 {font-size: 3rem;margin-bottom: 0;font-weight: bold;}
.sec04_tt3 .en{font-size: 113.3333%;}

.sec05_h2{font-size: 3.9rem;font-weight: bold;text-align: center;margin-bottom: 4.3rem;letter-spacing: 0.15rem;}
.sec05_h2 .en{font-size: 110.25654%;letter-spacing: 0.05rem;}
.sec05_des{font-weight: 200;}
.sec05_list dl .tt1{font-size: 4rem;font-weight: bold;margin-bottom: 0;line-height: 1.12;margin-top: -0.8rem;}
.sec05_list dl .tt2{font-size: 2.4rem;font-weight: bold;line-height: 1.35;margin-bottom: 0.5rem;letter-spacing: -.05rem;}
.sec05_list dl .des{margin-bottom: 2rem;line-height: 1.36;}
.sec05_list dl .des2{margin-bottom: 0;}
.sec05_list dl .des2 .en{margin-left: 2rem;font-size: 110%;margin-right: -0.6rem;}
.sec05_list dl .notice{position: absolute;z-index: 2;bottom: 0.5rem;left: 1.4rem;color: #FFF;font-family: var(--f-PORHead);}
.sec05_list dl dt{position: relative;}

/*============= FOOTER ==============*/
footer{position: relative;z-index: 3;}
address{background-color: #000;padding: 1.5rem 1rem;color:#bbbbbb;text-align:center;font-size: 1.2rem;font-weight: 300;letter-spacing: -.02rem;}
.ft_tt{margin-bottom: 1.5rem;line-height: 1.4;font-size: 3.5rem;font-weight: bold;letter-spacing: 0.2rem;font-family: var(--f-PORHead);}
.ft_tt .en{font-size: 114.2856%;letter-spacing: 0.1rem;font-family: var(--f-PORHead);}
.ft_add{font-size: 2.2rem;line-height: 1.4;letter-spacing: 0.1rem;}
.ft_add .letter{letter-spacing: -.1rem;}

.to_top{position:fixed;z-index:9;width:7rem;height:7rem;bottom:2rem;right:2rem;cursor:pointer;transition:all .2s;opacity:0;visibility:hidden}
.to_top.show{transform:scale(1);opacity:1;visibility:visible}

/* FIREFOX ONLY */
@-moz-document url-prefix() {}

/* Safari 10.1+ (which is the latest version of Safari at this time) */
@media not all and (min-resolution: 0.001dpcm) {}

@media screen and (min-width: 751px) {
  .sp{display:none !important}
  .find_a,.find_out{cursor: pointer;}
  .nowrap_pc{white-space: nowrap;}
  .alignleft{float:left;margin-right:2rem;margin-bottom:2rem;max-width:30rem}
  .alignright{float:right;margin-left:2rem;margin-bottom:2rem;max-width:30rem}
  .image_r{float:right;margin:0 0 0 5rem}
  .image_l{float:left;margin:0 5rem 0 0}

  #logo::before{right: calc(100% + 4rem);}
  #logo::after{left: calc(100% + 4rem);}
  .h_box .inner{max-width: 420px;width: 100%;}
  .mv {height: 100vh;background: url(../images/mv_bg.jpg) no-repeat center center / cover; max-height: 100vh;}

  .sec02_box {display: flex;justify-content: space-between;align-items: flex-start;gap: 60px;margin-bottom: 14rem;}
  .sec02_box_l {width: 100%;}
  .sec02_box_r {max-width: 475px;}
  .sec03 {padding: 0rem 0 12rem;}
  .sec03_list {display: flex;flex-wrap: wrap;gap: 4.5rem 2rem;margin-bottom: 8.1rem;}
  .sec03_list dl:not(.full){width: calc(50% - 1rem);}
  .sec03_list dl dd .des{line-height: 1.35;letter-spacing: -0.1rem;}
  .sec04_des{line-height: 1.53;margin-bottom: 2.2rem;letter-spacing: -.1rem;}
  .sec04_box {display: flex;justify-content: space-between;}
  .sec04_box_l {max-width: 45.2rem;width: 45%;padding-top: 0.2rem;}
  .sec04_box_r {max-width: 51.2rem;width: 51%;}
  .sec05{padding: 7.8rem 0 0;}
  .sec05_list{margin-bottom: 4.3rem;}
  .sec05_des{margin-bottom: 8.5rem;letter-spacing: -.06rem;}
  .sec05_list dl{display: flex;gap: 3rem;align-items: center;}
  .sec05_list dl:not(:last-child){margin-bottom: 43px;}
  .sec05_list dl:nth-of-type(2) .des,
  .sec05_list dl:nth-of-type(3) .des,
  .sec05_list dl:nth-of-type(4) .des{letter-spacing: -0.05rem;}
  .sec05_list dl .tt2.mb0{margin-bottom: -0.7rem;margin-top: -0.2rem;}
  .sec05_list dl dd{flex-shrink: 0;max-width: 40rem;width: 40%;}
  .sec05_list dl .note{line-height: 1.13;margin-top: 0;letter-spacing: -0.05rem;}

  .ft_box{padding: 70px 0 81px;}

  /* HOVER */
  .btn a:not([target="_blank"]):hover{opacity: 0.7;}
  .to_top img:hover,.find_a:hover,.pagenavi a:hover{opacity:.8}
}


@media screen and (min-width: 751px) and (max-width:1580px){
  #logo{margin: 0 auto;}
  #logo img{max-width: 300px;}
  .h_box{top: 4rem;}
  .to_top{width: 5rem;}
  .h_box .inner{width: 90rem;}
}

@media screen and (min-width: 1025px) {
  .mv { 
    height: 48.5vw; 
    background: url(../images/mv_bg.jpg) no-repeat 30% center / cover;
    max-height: 100vh; 
  }
}

@media screen and (min-width: 751px) and (max-width:1024px){
  html{font-size: 50%;}
  .f26{font-size: 2rem;}
  .f28{font-size: 2.2rem;}
  .f30{font-size: 2.4rem;}
  .sec01_tt {font-size: 5rem;}
  .sec01_tt .lg{font-size: 5.5rem;}
  .sec01_tt .big{font-size: 6rem;}
  .sec02_box_r{width: 50%;}
  .sec02_box_l{width:50%}
  .btn a{width: 500px;height: 80px;font-size: 2.4rem;}
  .sec05_des,.sec05_list dl .notice{font-size: 1.1rem;}
.mv {
    background: url(../images/mv_bg.jpg) no-repeat center top / contain;
    height: 57.4vw;
    min-height: 0 !important; 
    max-height: none;
    margin-top: 0;
  }
  #logo img{max-width: 190px;}
}


@media screen and (max-width: 750px) {
    h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, th, td, pre, address, li, dt, dd{font-size: 160%;}
    img{max-width:100%; height: auto;}
    .pc{display:none!important}
    #wrapper,header,main,footer,.inner{width:100%!important;min-width:unset!important}
    .image_r,.image_l{display:inline-block;width:100%;text-align:center;margin:0 auto 3rem !important}
    .f35{font-size: 2.8rem;}
    .f31{font-size: 2.3rem;}
    .f30{font-size: 2.2rem;}
    .f28{font-size: 2.1rem;}
    .f27{font-size: 2rem;}
    .f26{font-size: 1.9rem;}
    .f24{font-size: 1.8rem;}
    .f22{font-size: 1.7rem;}
    .f18{font-size: 1.6rem;}
    .f17{font-size: 1.5rem}
    .f16{font-size: 1.4rem;}
    .f15{font-size: 1.2rem;}
    .f12{font-size: 1rem;}
    /*==========================================================================*/
    /*                                 TOP PAGE                                 */
    /*==========================================================================*/
    .h_box{top: 2rem}
    #logo{margin: 0 auto;}
    #logo img{max-width:150px;}
    /*============= MAIN ==============*/
    .mv { height: 117vw;background: url('../images/mv_bg_sp.jpg') no-repeat center / contain;}
      
    .btn a{width: 32rem;height: 6rem;font-size: 1.8rem;}

    /*section共通*/
    .sec_title {font-size: 2.6rem;padding: 1.5rem 0;margin: 0rem 0 2rem;}

    /*sec01*/
    .sec01 {padding: 6rem 0 4rem;}
    .sec01_tt {font-size: 4.0rem;line-height: 1.1;}
    .sec01 .hero-subtext01 {font-size: 2.4rem;margin-bottom: 1.3rem;line-height: 1.3;}
    .sec01 .hero-subtext02 {font-size: 3.2rem;margin-top: 1.3rem;line-height: 1.3;}
    .sec01_desc{margin-bottom: 3rem;}
    .sec01_desc p {font-size: 2rem;}

    /*sec02*/
    .sec02 {padding: 0;}
    .sec02_tt1{font-size:2.3rem;}
    .sec02_tt2{font-size:2rem;}
    .sec02 .sec02_img{margin-bottom: 4rem;}
    .sec02 .sec_table01 {margin-bottom: 2rem;}

    .sec03{padding: 5rem 0 4rem;}
    .sec03 h2 span.sec03-int {font-size: 1.8rem;}
    .sec03 h2 {font-size: 2.2rem;}
    .sec03 h2 span.f-normal {font-size: 2.0rem;}
    .sec03 .sec03_txt1 {font-size: 1.5rem;}
    .sec03 .sec03_txt2 {font-size: 1.4rem;}
    .sec03 .sec03-contents {padding: 3rem 2rem;margin-bottom: 4rem;}

    .sec04 {padding: 3rem 0rem;}
    .sec04_tt1{font-size: 2.6rem;margin-bottom: 2rem;}
    .sec04_txt1{font-size: 1.5rem;}
    .sec04_txt2{font-size: 1.2rem;}
    .sec04_access{font-size: 1.4rem;}
    .sec04_tt1::after {height: 2px;}


    .ft_box{padding: 4rem 0;}
    .ft_tt1{font-size: 2.6rem;line-height: 1.4;}
    .ft_tt{font-size: 2.4rem;}
    .ft_add{font-size: 1.6rem;letter-spacing: 0.05rem;}

    address{font-size: 1.2rem;}
    /*============= FOOTER ==============*/
    .to_top{width:5rem;height:5rem;right:1rem;bottom: 1rem;}

  /*テーブル*/
  .sec_table01 {margin-bottom: 4rem;border-collapse: separate;}
  .sec_table01 th, .sec_table01 td { display: block; width: 100%; border-right: none; padding: 1.0rem 0; font-size: 1.6rem;} 
  .sec_table01 th { padding-top: 2.0rem; border-bottom: none;text-align-last: unset;} 
  .sec_table01 td { padding-bottom: 2.0rem; border-bottom: 1px solid #eee; }
  .sec_table01 span {font-size: 1.3rem;}
  .sec_table01 td small {font-size: 1.3rem;}

  .sec02 .sec02_box {margin-bottom: 5rem;}
  .sec02 .sec_table01 td {border: none;}
  .sec02 .sec_table01 th {padding: 1.0rem 0;font-size: 1.6rem;width: 100%;}
  .sec02 .sec_table01 span {font-size: 1.3rem;}

  .sec_table02 {margin-bottom: 5rem;}
  .sec_table02 th, .sec_table02 td {font-size: 1.6rem;}
  .sec_table02 tr:first-child th, .sec_table02 tr:first-child td {border-top: none;}
  
  /*申し込みボタン*/
  .btn_entry{font-size:2.2rem;padding:1.5rem 3.0rem;width:90%;box-sizing:border-box;}

  /*注意事項*/
  .notes_title {font-size: 1.8rem;}
  .notes_list li {font-size: 1.5rem;padding-left: 1.5em; text-indent: -1.5em;}
  .sec_notes {margin: 4rem auto 0;}

}

@media screen and (max-width: 374px) {
    html{font-size: 50%;}
}