@charset "UTF-8";
/*****************************
* A Modern CSS Reset (https://github.com/hankchizljaw/modern-css-reset)
* 上記に、ul要素,ol要素,a要素への記述追加
* input,button,textarea,selectにcolor: inherit;を追加
*****************************/
/* Box sizing rules */

/* ------------------------ PC --------------------------- */
body{color: #20394e;}
.img-fit {width: 100%; height: auto;}
.sp-open{display: none;}
.sp-close{display: initial;}
.font-black{color:#20394e;}
.bg-gray{background:#f6f5f6;}

.wifi-main1{
  background:#00c6a7; 
  color:#ffffff; 
  padding:100px 0 0 0; 
  width: 100%;
  background-image: url('../img/main/bg-img1.png'), url('../img/main/bg-img2.png');
  background-position: right top,left bottom;
  background-repeat: no-repeat, no-repeat;
}

.wifi-main1-1{
  margin: 0 auto 70px auto; 
  width: 70%; 
  display: flex;
}

.wifi-main1-1l{
  width: 55%; 
  margin-right: 5%;
}

.wifi-main1-1l-1{
  margin-bottom: 35px;
}

.wifi-main1-1l-txt1{
  font-weight: bold; 
  margin-bottom: 20px; 
  font-size: 1.6vw;
}

.wifi-main1-1l-txt2{
  font-size: 1.0vw;
}

.wifi-main1-1r{
  width: 40%;
}

.wifi-main1-2{
  margin-bottom: 150px; 
}
.wifi-main1-2a{
  display: contents;
}
.wifi-main1-2img{
  margin: 0 auto; 
  width: 250px;
}
.wifi-main1-2img:hover{
  opacity:0.5;
  transition: opacity 0.2s ease-in-out;
}
.wifi-main2-title{
  text-align: center; 
  font-weight: 300; 
  font-size: 2.6vw; 
  margin-bottom: 40px;
}

.wifi-main2-1{
  margin: 0 auto; 
  padding-bottom: 50px; 
  width: 65%; 
  display: flex;
}

.wifi-main2-1l{
  width: 40%; 
  margin-right: 7%;
}

.wifi-main2-1r{
  width: 52%; 
  font-size: 18px; 
  line-height: 2em; 
  padding-top: 90px;
}


.wifi-main3{
  padding-top: 70px;
}

.wifi-main3-title{
  text-align: center; 
  font-weight: 300; 
  font-size: 2.6vw;
  margin-bottom: 70px;
}
.wifi-main3-1{
  margin:0 auto; 
  display:flex; 
  width:60%; 
  margin-bottom: 80px;
}

.wifi-main3-1l{
  width:50%; 
  margin-right: 5%;
}

.wifi-main3-1r{
  width:45%;
}

.wifi-main3-1r-txt1{
  font-size: 2vw; 
  color:#00c6a7;
  margin-top: 40px;
  margin-bottom: 15px;
}

.wifi-main3-1r-txt2{
  font-size: inherit;
}

.wifi-main4-1{
  width: 32%; 
  margin: 0 auto; 
  display: inline-block;
  vertical-align: top;
  height: 360px;
}

.wifi-main4-1-1{
  height:50px; 
  width:50px; 
  border-radius:50%; 
  line-height:50px; 
  text-align:center; 
  background:#00c6a7; 
  color:#ffffff; 
  font-weight: 600; 
  font-size: 30px; 
  margin: 0 auto;
}
.wifi-main4-1-2{
  text-align: center;
}
.wifi-main4-1-2 img{
  margin:0 auto;
  height:auto;
}

.wifi-main4-1-3{
  text-align: center;
}
.wifi-main4-1-3.sub{
  font-size: 12px;
}
.wifi-main4-1-3 .btn{
  display:none;
}
.wifi-main4-2{
  width: 100%; 
  margin: 0 auto; 
  display: block;
  height: 360px;
}
.wifi-main4-2 div img{
  width: 19vw;
}

.wifi-main4-3{
  width: 48%; 
  margin: 0 auto; 
  display: inline-block;
  vertical-align: top;
  height: 360px;
}

.wifi-main4{
  background:#ccf4ed; 
  padding-top:70px;
}

.wifi-main4-title{
  text-align: center; 
  font-weight: 300; 
  font-size: 2.6vw; 
  margin-bottom: 60px;
}

.wifi-main4-frame{
  margin:0 auto; 
  background:#ffffff; 
  width: 80%; 
  border-radius: 20px;
  padding:40px;
  margin-bottom: 60px;
}

.wifi-main4-frame-title{
  text-align: center; 
  font-weight: 400; 
  font-size: 2.6vw; 
  color:#00c6a7; 
  margin-bottom: 60px;
}

.wifi-main4-2{
  width: 100%; 
  margin: 0 auto; 
  display: block;
  height: 360px;
}

.wifi-main4-4{
  text-align: center; 
  background: #fff133; 
  font-size: 1.5vw; 
  width: 600px; 
  margin: 0 auto;
  padding:5px 0;
}
.youtube-ratio{
  text-align: center;
  padding-bottom: 80px;
}
.wifi-main5{
  padding-top: 60px;
}
.wifi-main5-title{
  text-align: center;
  font-weight: 300;
  font-size: 2.6vw;
  margin-bottom: 70px;
}
.wifi-main5-table{
  width:1000px; 
  text-align: center; 
  margin:0 auto; 
  border-spacing: 15px;
  margin-bottom: 50px;
}

.wifi-main5-table-td{
  border-radius: 8px; 
  padding: 10px;
  width: 25%;
  color:#ffffff;
}
.wifi-main5-table-td-1{
  font-weight: bold;
  margin-bottom: 3px;
  font-size: 18px;
}

.wifi-main5-table-td-2{
  font-size: 11px;
  font-weight: bold;
}
.wifi-main5-table-td-3{
  font-size: 12px;
}
.td-bg1{
  background:#beded8;
}
.td-bg2{
  background:#15ac9f;
}
.td-bg3{
  background:#0d877d;
}
.td-bg4{
  background:#15ac9f;
}

.wifi-main5-table-td-jp{
  font-weight: bold;
  font-size: 28px;
}

.wifi-main5-table-td-en{
  font-weight: bold;
  font-size: 14px;
}

.wifi-main5-table-td-en2{
  font-weight: bold;
  font-size: 10px;
}

.wifi-main5-table-space{
  padding: 11px 0;
}

.wifi-main5-caution{
  color: #ff0000;
  width: 70%;
  margin: 0 auto 60px auto;
}

.wifi-main6{
  background:#6ce0f5; 
  padding-top: 60px;
  background-image: url('../img/main/bg-img1.png'), url('../img/main/bg-img2.png');
  background-position: right top,left bottom;
  background-repeat: no-repeat, no-repeat;
}
.wifi-main6-title{
  text-align: center;
  font-weight: 300;
  font-size: 2.6vw;
  margin-bottom: 80px;
  color: #ffffff;
}

.wifi-main6-1{
  display: flex;
  width: 80%;
  margin: 0 auto;
  padding-bottom: 80px;
}

.wifi-main6-1-1,
.wifi-main6-1-2{
  width: 30%;
  margin-right:10%;
}

.wifi-main6-1-3{
  width: 30%;
}

.wifi-main6-1-2-1{
  margin-bottom: 60px;
}

.wifi-main6-1-2-1-txt{
  margin-bottom: 25px;
}

.wifi-main6-1-2-1-app{
  display: flex;
}
.wifi-main6-1-2-1-app .appstore{
  padding-right:5%;
}

.wifi-main6-1-2-1-app .googleplay{
  padding-left:5%;
}

.wifi-main7{
  background: #ccf4ed;
  padding: 60px 0;
  display: inline-block;
}

.wifi-main7-title{
  text-align: center;
  font-weight: 300;
  font-size: 2.6vw;
  margin-bottom: 80px;
}

.wifi-main7-frame{
  margin: 0 auto;
  background: #ffffff;
  width: 80%;
  border-radius: 20px;
  padding: 40px;
  margin-bottom: 50px;
}

.wifi-main7-frame-title{
  text-align: center;
  font-weight: 400;
  font-size: 2.6vw;
  color: #00c6a7;
  margin-bottom: 80px;
}

.wifi-main7-frame-1{
  margin: 0 auto 50px auto;
  width:90%;
}

.wifi-main7-frame-1a{
  font-weight: bold;
  font-size: 20px;
  width: 50%;
  display: inline-block;
}
.wifi-main7-frame-1b{
  font-size: 20px;
  width: 50%;
  display: inline-block;
  line-height: 1.8em;
}

.wifi-main7-info{
  text-align: right;
}

.tou {
  width: 80%;
  margin: 0 auto;
}

.tou h1{
  text-align: center;
  margin: 50px 0 70px 0;
  font-size: 36px;
}

.tou h2{
  margin-bottom: 30px;
  padding-top: 10px;
  font-size: 27px;
  text-align: center;
}
.tou h3{
  font-size: 22px;
  margin-bottom: 18px;
}
.tou p{
  margin-bottom: 27px;
  line-height: 1.8em;
  font-size: 18px;
}

.tou table{
  border: 1px solid #000;
  font-size: 18px;
  border-collapse: collapse;
}
.tou td,
.tou th{
  padding: 4px;
  vertical-align: top;
}
.tou .tdsize1{
  width: 140px;
}

.tou ol,
.tou ul{
  padding-left: 26px;
  font-size: 18px;
  line-height: 1.8em;
}
.tou li{
  list-style: auto;
}



/* ---------------------- tablet ------------------------- */
@media screen and (max-width: 767px) {
.sp-open{display: inherit;}
.sp-close{display: none;}

.wifi-main1-1{
  display: inherit;
  margin: 0 auto 50px auto;
}
.wifi-main1-1l{
  width: 100%;
  margin: 0 auto;
}
.wifi-main1-1r{
  width: 80%;
  margin: 0 auto;
}
.wifi-main1-1b{
  text-align: center;
  margin-bottom: 50px;
}

.wifi-main1-1l-txt1m{
  font-size: 4vw;
  margin-bottom: 10px;
}

.wifi-main1-1l-txt2m{
  font-size: 1.6vw;
}

.wifi-main2-title{
  font-size: 5vw;
}
.wifi-main1-2{
  margin-bottom: 120px;
}
.wifi-main2-1{
  display: inherit;
}
.wifi-main2-1l{
  width: 70%;
  margin: 0 auto;
}
.wifi-main2-1r{
  padding: 0;
  width: 85%;
  margin: 0 auto;
}
.wifi-main5-flow{
  overflow: scroll;
}

.wifi-main3-title{
  font-size: 5vw;
}

.wifi-main3-1{
  display: inherit;
  width: 70%;
}

.wifi-main3-1l{
  width: 100%;
  margin: 0;
}
.wifi-main3-1r{
  width:100%;
  text-align: center;
}
.wifi-main3-1r-txt1{
  font-size: 5vw;
}
.wifi-main3-1r-txt2{
  font-size: 2.8vw;
}

.wifi-main4-title{
  font-size: 5vw;
}
.wifi-main4-frame-title{
  font-size: 5vw;
}

.wifi-main4-1{
  width: 48%;
}
.wifi-main4-2 div img{
  width: 45%;
}
.wifi-main4-1-3 .btn{
  display: block;
  background: #00c6a7;
  padding: 8px 0;
  border-radius: 7px;
  color: #fff;
  font-weight: bold;
  width: 90%;
  margin: 9px auto 0 auto;
}
.wifi-main4-1-3 .btn:hover{
  opacity: 0.9;
}
.wifi-main4-4{
  font-size: 2.5vw;
  width: 90%;
}

.youtube-ratio {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  height: 0;
}

.youtube-ratio iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wifi-main5-title{
  font-size: 5vw;
}

.wifi-main5-caution{
  width: 90%;
}

.wifi-main6-1{
  width: 70%;
  padding-bottom: 50px;
}

.wifi-main6-1-1, .wifi-main6-1-2{
  width: 50%;
  margin-right: 5%;
}

.wifi-main6-title{
  font-size: 5vw;
}

.wifi-main6-1-2-1{
  margin-top: 85px;
}
.wifi-main7-title,
.wifi-main7-frame-title{
  font-size:5vw;
}

.wifi-main7-frame-1{
  width: 100%;
}
.wifi-main7-frame-1a{
  width: 100%;
  font-size: 3vw;
}

.wifi-main7-frame-1b{
  width: 100%;
  font-size: 3vw;
  line-height: 1.0em;
  margin-bottom: 23px;
  padding-left: 26px;
  font-weight: 300;
}



} /*-------------------- Smart Phone ----------------------*/
@media screen and (max-width: 500px) {

.wifi-main1,
.wifi-main6{
  background-image: url('../img/main/bg-img3.png'), url('../img/main/bg-img4.png');
}

.wifi-main1-1{
  width: 80%;
}

.wifi-main2-1{
  width: 85%;
}

.wifi-main2-title,
.wifi-main3-title,
.wifi-main4-title,
.wifi-main4-frame-title,
.wifi-main5-title,
.wifi-main6-title,
.wifi-main7-title,
.wifi-main7-frame-title{
  font-size: 6.5vw;
  margin-bottom: 45px;
}

.wifi-main3-1{
  width: 80%;
}

.wifi-main3-1r-txt2,
.wifi-main4-1-3{
  font-size: 4vw;
}

.wifi-main3-1r-txt1{
  font-size: 6vw;
}

.wifi-main4-1{
  width: 100%;
  height: initial;
  margin-bottom: 40px;
}
.wifi-main4-1-3 .sub{
  font-size: 3vw;
}
.wifi-main4-2 div img{
  width: 90%;
}
.wifi-main4-3{
  width: 100%;
    height: auto;
    margin-bottom: 40px;
}

.wifi-main4-4{
  width: 100%;
  font-size: 3.5vw;
  padding: 10px 0;
}

.wifi-main5-caution{
  font-size: 3.5vw;
}

.wifi-main6-1{
  display: block;
}
.wifi-main6-1-1{
  margin: 0 auto 30px auto;
  width: 70%;
}

.wifi-main6-1-2{
  margin: 0 auto 30px auto;
  width: 90%;
}

.wifi-main6-1-2-1{
  margin-top: 0;
}

.wifi-main7-frame-1a,
.wifi-main7-frame-1b{
  font-size: 3.2vw;
}

.tou {
  width: 90%;
}

} /*--------------------------------*/