@charset "utf-8";

html {
font-size: 62.5%; /* -> 10px; */
}

br {
    font-size: 0px;
}

body {
 overflow-x: hidden;
  position: relative;
  font-size: 1.4em;
}

* {margin:0; padding:0;}
ol, ul {list-style-type:none;}
a {outline:none;}

tr, th, td, div, span, a,p, i {
	color: inherit;
}

a:link, a:visited {
  text-decoration: none;
}

article p {
	font-size: inherit;
	color: inherit;
	line-height: inherit;
}


/* フェード設定 */

.fadein {
    opacity : 0;
    transform : translate(0, 5rem);
    transition:all 0.9s;
}


@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(5rem);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/* 波ループ */

@keyframes scrollAnime {
 0% {
   background-position: 0 0;
  }
 100% {
   background-position: -635px 0 ;
  }
}


/* 画面100%表示用↓ここから */
.mainContentMT {
	width: 100vw;
}

/*　パンくずの表示くずれ防止　*/
.rootMT ul {
    overflow: hidden;
    width: 940px;
    margin: 0 auto;
}
/* 画面100%表示用↑ここまで */


.pc { display: block !important; }
.sp { display: none !important; }

.freeArea-direct {
	box-sizing: border-box;
	margin: 0px;
	padding: 0px;
    position: relative;
}

#monaco_all {
 text-align: center;
 font-family: 'Noto Sans JP','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic', sans-serif;
 font-weight: 400;
 font-style: normal;
 font-feature-settings: "palt";
 color: #1a1a1a;
 letter-spacing: 0.1rem;
 position: relative;
}

.logo {
  width: 20rem;
  display: block;
  margin: 3rem auto;
}

.main_all {
  width: 100%;
  background: url(../img/main_back.png) no-repeat fixed;
  background-size: cover;
  height: 120vh;
  position: relative;
}

.main_all::before {
  content: "";
  position: absolute;
  background-image: url(../img/wave_top.png);
  animation:  scrollAnime 8s linear infinite;
  height: 3.8rem;
  bottom: -1px;
  left: 0;
  width: 100%;
  z-index: 1;
  background-size: contain;
}

.main_all .title {
  text-align: center;
  width: 100%;
  height: 100%;
  position: relative;
}

.main_all .title::after {
    right: 3rem;
}

/*メインタイトル*/
div.title img {
  width: 55rem;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  position: absolute;
  filter: drop-shadow(0.5rem 0.5rem 1rem rgba(0,0,0,.2));
}

/* 飾り線のクラス */
.line {
  position: relative;
  padding: 10rem 0;
}

/* 飾り線
.line::before {
  content:"";
  display: block;
  position: absolute;
  top: -2rem;
  left: 0;
  background: url(../img/line.png) repeat-x top left;
  width: 100%;
  height: 2rem;
  background-size: auto 100%;
}  */

.copyright_bv::after {
  content: "©BVergély";
  font-size: 1rem;
  display: inline-block;
  position: absolute;
  right: 0.5rem;
  bottom: -1.8rem;
  color: #808080;
  z-index: 3;
  background-color: #fff;
}

.copyright_sbm::after {
  content: "©MONTE-CARLO Société des Bains de Mer";
  font-size: 1rem;
  display: inline-block;
  position: absolute;
  right: 0.5rem;
  bottom: -1.8rem;
  color: #808080;
  z-index: 3;
  background-color: #fff;
}

.copyright::after {
  content: "©モナコ政府観光会議局";
  font-size: 1rem;
  display: inline-block;
  position: absolute;
  right: 0.5rem;
  bottom: -1.8rem;
  color: #808080;
  z-index: 3;
  background-color: #fff;
}

.copyright_fair::after {
  content: "©Fairmont Hotels & Resorts";
  font-size: 1rem;
  display: inline-block;
  position: absolute;
  right: 0.5rem;
  bottom: -1.8rem;
  color: #808080;
  z-index: 3;
  background-color: #fff;
}


.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.flex img {
    flex-shrink:0;
}

.img_title {
  display: block;
  margin: 0 auto 3rem;
}

.introduction {
  position: relative;
  margin: 5rem auto 10rem;
}

.introduction .text {
  text-align: left;
}

.ph_all {
  position: relative;
  width: 70rem;
  height: 70rem;
  margin: 0 5rem;
}

.ph1, .ph2, .ph3 {
  position: absolute;
  height: fit-content;
}

.ph1 img, .ph2 img, .ph3 img {
  width: 100%;
}

.ph1 {
  z-index: -2;
  left: 0;
  top: 0;
  width: 40rem;
}

.ph2 {
 z-index: -1;
 right: 0;
 top: 0;
 bottom: 0;
 margin: auto;
 width: 25rem;
 height: 18.75rem
}

.ph3 {
  z-index: -1;
 left: 5rem;
  bottom: 0;
  width: 50rem;
}

.bonjour {
  width: 39rem;
  margin-bottom: 3rem;
  display: block;
}

.text {
  font-size: 1.5rem;
  line-height: 2.5;
  font-weight: 500;
}

.title {
  font-size: 2.5rem;
}

.bikou {
    font-size: 1.3rem;
  line-height: 1.8;
}

.bikou a {
  font-size: 1.3rem;
  line-height: 1.8;
  text-decoration: underline;
}

#about {
 position: relative;
}

#about::after {
  content: "";
  display: block;
  position: absolute;
  top: -5rem;
  right: 5rem;
  width: 50rem;
  height: 42rem;
  background: url(../img/map.png) no-repeat;
  background-size: contain;
  z-index: -1;
}

#about .text {
    margin: 3rem auto;
}

#about .img_title {
    width: 67.9rem;
}

.about {
 position: relative;
 max-width: 940px;
 margin: 0 auto;
}

.abt_cont {
    width: 25rem;
    height: 25rem;
    margin: 2.5rem;
    box-sizing: border-box;
    padding: 2rem;
    border-radius: 3rem;
    background-color: #faebee !important;
}

.abt_cont:nth-of-type(1) {
  background:url(../img/area_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

.abt_cont:nth-of-type(2) {
  background:url(../img/time_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

.abt_cont:nth-of-type(3) {
  background:url(../img/weather_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

.abt_cont:nth-of-type(4) {
  background:url(../img/lang_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

.abt_cont:nth-of-type(5) {
  background:url(../img/euro_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

.abt_cont:nth-of-type(6) {
  background:url(../img/visa_icn.png) no-repeat;
  background-size: 60%;
  background-position: center;
} 

#about .abt_cont .text {
  margin: 0 0 3em;
  text-align: center;
}

.abt_cont .title {
 margin-bottom: 1em;
}

.abt_cont .title span {
  font-size: 3.5rem;
  color: #bd0c2e;
  font-weight: 700;
}

.abt_cont .title span.small {
    font-size: 2.5rem;
}

.bg_all {
  width: 100%;
  height: 50rem;
  position: relative;
  margin: 0 auto;
}

.bg_all div {
  width: 100%;
  height: 50rem;
  position: absolute;
  top:0;
  left: 0;
  background-size: cover !important;
  background-attachment: fixed !important;
  background-position: center;
}

.bg_01 {
  background: url(../img/back01.jpg) no-repeat;
}

.bg_02 {
  background: url(../img/back02.jpg) no-repeat;
}

.bg_03 {
  background: url(../img/back03.jpg) no-repeat;
}

.bg_04 {
  background: url(../img/back04.jpg) no-repeat;
}

.bg_05 {
  background: url(../img/back05.jpg) no-repeat;
}

.bg_01::after,.bg_02::after,.bg_03::after,.bg_05::after {
  content: "©BVergély";
  position: absolute;
  bottom: -1.6rem;
  right: 2rem;
  color: #808080;
  display: inline-block;
  z-index: 3;
  font-size: 1rem;
}

.bg_04::after {
  content: "©MANUEL VITALI & MICHAEL ALESI/DIRECTION DE LA COMMUNICATION";
  position: absolute;
  bottom: -1.6rem;
  right: 2rem;
  color: #808080;
  display: inline-block;
  z-index: 3;
  font-size: 1rem;
}

#guide .img_title {
    width: 60.5rem;
}

#guide .title {
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-weight: 600;
  margin: 2rem auto 1rem;
  position: relative;
}

.hotel, .casino, .spa, .night {
  display: block;
  position: relative;
  height: 50rem;
  width: 100%;
  margin: 5rem auto 10rem;
}
 
.hotel::after, .spa::after {
  right: 2.5rem;
}

.casino::after, .night::after {
  right: inherit;
  left: 0.5rem;
}

.hotel {
 background: url(../img/hotel_bg.png) no-repeat;
 background-position: right top;
 background-size: 120rem 50rem; 
}

.casino {
 background: url(../img/casino_bg.png) no-repeat;
 background-position: left top;
 background-size: 120rem 50rem; 
}

.spa {
 background: url(../img/spa_bg.png) no-repeat;
 background-position: right top;
 background-size: 120rem 50rem; 
}

.night {
 background: url(../img/night_bg.png) no-repeat;
 background-position: left top;
 background-size: 120rem 50rem; 
}

img.hotel_icn {
    width: 16rem;
    height: auto;
}

img.casino_icn, img.spa_icn {
    width: 15.8rem;
}

img.night_icn {
    width: 21.2rem;
}

.block {
 position: absolute;
 top: 25rem;
 margin: auto;
 transform: translateY(-50%) !important;
}

.left_b {
  left: 10rem;
}

.right_b {
  right: 10rem;
}

.contents {
  margin: 10rem auto;
}

.reverse {
  flex-direction: row-reverse;
}

.photo_slide {
  display: block;
  width: 60rem;
  height: 34.2rem;
  position: relative;
}

.photo_slide img {
  width: 100%;
  display: block;
  vertical-align: top;
  font-size: 0;
  object-fit: cover;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.photo_slide_n {
  display: block;
  width: 60rem;
  height: 34.2rem;
  position: relative;
}

.photo_slide_n p {
  width: 100%;
  display: block;
  vertical-align: top;
  font-size: 0;
  object-fit: cover;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.photo_slide_n p img {
  width: 100%;
}


.left {
  margin-left: 5rem;
}

.right {
  margin-right: 5rem; 
}

.text_all {
  width: 50rem;
  text-align: left;
}

.text_all .title {
  font-size: 2.5rem;
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-weight: 600;
  margin: 2rem auto 1rem;  
 line-height: 1;
}

.text_all .title span {
  font-size: 1.4rem;
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-weight: 600;
}

.text_all .text {
  text-align: left;
}

.five_star::after {
    content: "★★★★★";
    font-size: 1.2rem;
    color: #c4a773;
    letter-spacing: 0.5rem;
    display: inline-block;
    position: absolute;
    right: 0;
}

.four_star::after {
    content: "★★★★";
    font-size: 1.2rem;
    color: #c4a773;
    letter-spacing: 0.5rem;
    display: inline-block;
    position: absolute;
    right: 0;
}

div#movie .bikou {
  margin-top: 1rem;
  text-align: center;
}


#movie img.img_title {
    width: 65.5rem;
}

video.monaco_video {
  width: 70rem;
  display: block;
  margin: 3rem auto 0;
  cursor: pointer;
  transition: .5s ease;
}

video.monaco_video:hover {
 opacity: .8;
}

#campaign {
  background: url(../img/campaign_bg.png) no-repeat;
  background-size: cover;
  background-attachment: fixed;
  position: relative;
}

#campaign::after {
  content: "©BVergély";
  font-size: 1rem;
  display: inline-block;
  position: absolute;
  right: 2rem;
  bottom: -1.8rem;
  color: #808080;
  z-index: 3;
}

#campaign .img_title {
    width: 50.8rem;
}

#campaign .text {
    color: #fff;
}

.campaign_img {
  width: 94rem;
  display: block;
  margin: 5rem auto;
  filter: drop-shadow(1rem 1rem 1rem rgba(0,0,0,.5));
}

.btn a {
 display: inline-block;
 font-size: 3rem;
 font-weight: 700;
 box-sizing: border-box;
 padding: 2rem 0rem;
 background-color: #bd0c2e;
 color: #fff;
 width: 94rem;
 border-radius: 2rem;
 letter-spacing: 0.5rem;
 transition: .5s ease;
 position: relative;
}

.btn a::after {
  font-family: "Font Awesome 5 Free";
  content: '\f138';
  font-weight: 900;
  position: absolute;
  right: 2rem
}

.btn a:hover {
  background-color: #fff;
  color: #bd0c2e;
}

#access .img_title {
  width: 33.4rem;
}

.map {
  width: 940px;
  margin: 0 auto 3rem;
  overflow-x: auto;
  white-space: nowrap;
}

.map_img {
  width: 100%;
}

/* スクロールの幅の設定 */
.map::-webkit-scrollbar {
  width: 1rem;
  height: 1rem;
}

/* スクロールの背景の設定 */
.map::-webkit-scrollbar-track {
  border-radius: 1rem;
  box-shadow: 0 0 4px #aaa inset;
}

/* スクロールのつまみ部分の設定 */
.map::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background: #bd0c2e;
}

.app_txt .text {
 font-size: 2rem;
 font-weight: 700;
 margin-bottom: 2rem;
  text-align: center;
}

.app_txt .title {
 font-size: 3rem;
 font-weight: 800;
 color: #bd0c2e;
}

p.icn {
  width: 10rem;
  height: 10rem;
  color: #fff;
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: 0.5rem;
  display: block;
  text-align: center;
  line-height: 10rem;
  border-radius: 10rem;
  background-color: #bd0c2e;
  margin-left: 2rem;
}

.app_sub {
  width: 800px;
  padding: 3rem;
  box-sizing: border-box;
  margin: 3rem;
  background-color: #f9eaed;
  border-radius: 3rem;
}

.app_scrn {
  width: 20rem;
  display: block;
  margin-right: 5rem;
}

.app_icn {
  width: 15rem;
  margin: 0 auto 3rem;
}

.qr_all {
    margin: 3rem;
}

p.qr {
  display: block;
  width: 120px;
  height: 120px;
  margin-right: 2rem;
}

p.qr img {
  width: 100%;
}

.dwnld_all .title {
  font-size: 3rem;
  font-weight: 800;
  margin-bottom: 1rem;
}

.app img, .google img {
  width: auto;
  height: 60px;
  margin: 0 10px;
}

@media screen and (max-width:1212px) {
  
  .introduction .text {
    text-align: center;
    margin-bottom: 3rem;
  }
  
  .bonjour {
    margin: 0 auto 3rem;
  }
}

#attention {
  width: 768px;
  box-sizing: border-box;
  padding: 5rem;
  border: solid 10px #bd0c2e;
  margin: 0 auto;
}

#attention .title {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 3rem;
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

#attention .text {
  text-align: left;
}

#attention .text a {
  font-size: 1.4rem;
  font-weight: 500;
  text-decoration: underline;
  color: #bd0c2e;
}


.ipad #campaign, .iphone #campaign, .ipad .main_all, .iphone .main_all, .iphone .bg_01, .ipad  .bg_01, .iphone .bg_02, .ipad .bg_02, .iphone .bg_03, .ipad  .bg_03, .iphone .bg_04, .ipad .bg_04, .iphone .bg_05, .ipad .bg_05, .iphone .bg_06, .ipad .bg_06{
   background-attachment: inherit !important;
}


@media screen and (max-width:1200px) {
  
  .right_b {
    right: 5rem;
  }
  
  .left_b {
    left: 5rem;
  }
  
  .hotel {
    background: url(../img/hotel_bg_tb.png) no-repeat;
    background-position: right top;
    background-size: 90rem 50rem;
  }
    
  .casino {
    background: url(../img/casino_bg_tb.png) no-repeat;
    background-position: left top;
    background-size: 90rem 50rem;
  }
  
   .spa {
    background: url(../img/spa_bg_tb.png) no-repeat;
    background-position: right top;
    background-size: 90rem 50rem;
  }
  
  .night {
    background: url(../img/night_bg_tb.png) no-repeat;
    background-position: left top;
    background-size: 90rem 50rem;
  }
    
}

/* チェックボックスの初期設定 */
#popup-on{
  display: none;
}
/* チェックされたらポップアップウインドウを開く */
#popup-on:checked + .popup{
  display: block;
}

.popup {
  width: 94rem;
  height: auto;
  background: rgba(26,26,26,.9);
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 10000;
  text-align: center;
  color: #1a1a1a;
  overflow-y: scroll;
  overflow-x: hidden;
  box-sizing: border-box;
}

/* スクロールの幅の設定 */
.popup::-webkit-scrollbar {
  width: 1rem;
  height: 1rem;
}

/* スクロールの背景の設定 */
.popup::-webkit-scrollbar-track {
  border-radius: 1rem;
  box-shadow: 0 0 4px #aaa inset;
}

/* スクロールのつまみ部分の設定 */
.popup::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background: #fff;
}

.popup .title {
  color: #fff;
  font-size: 2rem;
}

.popup .text {
  color: #fff;
  font-size: 1.4rem;
  line-height: 2;
  padding: 0 !important;
}

.popup .text a {
    color: #fff;
    font-size: 1.4rem;
    line-height: 2;
    text-decoration: underline;
}

/* ポップアップの内容 */
.popup-content{
  box-sizing: border-box;
  padding: 4rem 8rem;
  margin: 0 auto;
  text-align: left;
}

/* 開くボタン */
.btn-open{
  margin: 5rem auto 0;
  text-align: center;
  cursor: pointer;
  color: #fff;
  font-weight: 800;
  padding: 2rem 0rem;
  background-color: #1a1a1a;
  border-radius: 2rem;
  box-sizing: border-box;
  display: inline-block;
  width: 94rem;
}

.btn-open .title {
  font-size: 2rem;
}

/* 閉じるアイコン（右上） */
.icon-close{
  color: #fff;
  font-size: 3rem;
  padding: 1rem;
  position: absolute;
  right: 2rem;
  top: 2rem;
  font-weight: 800;
  line-height: 1;
  background: #bd0c2e;
  border-radius: 50%;
  cursor: pointer;
}

/* 閉じるボタン */
.btn-close{
 width: 50%;
 background: #bd0c2e;
 color: #fff;
 font-size: 1.6rem;
 margin: 3rem auto 5rem;
 padding: 1.5rem;
 text-align: center;
 font-weight: 800;
  cursor: pointer;
}



span.arrow {
	font-size: 1.6rem;
}

.botan span.arrow {
	font-size: 2rem;
}

/*矢印のアイコン*/
.arrow:before {
  font-family: "Font Awesome 5 Free";
  content: '\f138';
  font-weight: 900;
	margin-right: 5px;
}

.arrow_double:before {
    font-family: "Font Awesome 5 Free";
    content: '\f101';
    font-weight: 900;
}

.arrow_double:after {
    font-family: "Font Awesome 5 Free";
    content: '\f100';
    font-weight: 900;
}



@media screen and (max-width:1290px) {
  
  
  
  
  #about::after {
    top: -11rem;
    right: 0rem;
  }

}


@media screen and (max-width:1150px) {
  
  .contents {
    flex-direction: column-reverse;
  }
  
  .text_all {
    width: 60rem;
    margin: 3rem auto;
  }
  
  .right, .left {
    margin: 0 auto;
  }
}

@media screen and (max-width:1024px) {
    html {
    font-size: calc( 1000vw / 1024 );
  }
  .main_all {
    height: 120vmin;
  }
}

@media screen and (max-width:940px) {
  
  .map {
    width: 90vw;
  }
 .map_img {
  width: 940px;
  height: auto;
 }

}

@media screen and (max-width:767px) {

  
  #fftop_recomDetail section {
    padding: 0;
  }
  
  html {
    font-size: calc( 1000vw / 767 );
  }
  
  .sp { display: block !important; }
  .pc { display: none !important; }
  
  .text {
    font-size: 3.5vw !important;
    text-align: left;
    }
  
  .title {
    font-size: 5.2vw !important;
  }
  .bikou {
    font-size: 3vw !important;
    text-align: left;
  }

  .bikou a {
    font-size: 3vw !important;
  }
  
  .abt_cont .title {
    font-size: 4.2vw !important;
  }
  
  .abt_cont .title span {
    font-size: 6vw !important;
  }
  
  #about .abt_cont .text {
    margin: 0 0 1.5rem;
  }
  
  #about .abt_cont .bikou {
    text-align: center;
  }
  
  .main_all {
    background: url(../img/main_back_sp.png) no-repeat;
    background-size: cover;
  }
  
 .bg_all::before {
    top:0;
  }
  
  .introduction .text {
    text-align: left;
    margin: 3rem;
  }
  
  .ph_all {
    width: 100%;
    box-sizing: border-box;
    margin: 0 3rem;
  }
  
  .copyright::after, .copyright_sbm::after, .copyright_bv::after, #campaign::after, .copyright_all::after,.bg_01::after,.bg_02::after,.bg_03::after,.bg_04::after,.bg_05::after,.copyright_fair::after {
    bottom: -2.5vw;
    font-size: 2.5vw;
    line-height: 0;
    right: 1vw;
  }
  
  .copyright_all::after {
    display: none !important;
  }
  
  .copyright_sp {
    color: #808080;
    font-size: 2.5vw;
    width: 95vw;
    margin: 1vw auto 0;
    text-align: right;
}
  
  #guide::before {
    font-size: 2.5vw;
    right: 1vw;
  }
  
  #about .text {
    padding: 0 3rem;
  }
  
  #about .img_title {
    margin: 0 auto 25rem;
  }
  
  #about::after {
    width: 85vw;
    height: 71vw;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
}
  
  .abt_cont {
    width: 45vw;
    height: 45vw;
    margin: 2.5vw 2vw;
  }
  
  .photo_slide, .photo_slide_n {
    width: 95vw;
    height: 54.133vw;
  }
  
  .hotel, .casino, .spa, .night {
    height: inherit;
    box-sizing: border-box;
    background: none;
  }
  
  .hotel .block {
    background: url(../img/hotel_bg_sp.png) no-repeat;
    background-size: cover;
  }
    
  .casino .block {
    background: url(../img/casino_bg_sp.png) no-repeat;
    background-size: cover;
  }
  
   .spa .block {
    background: url(../img/spa_bg_sp.png) no-repeat;
    background-size: cover;
  }
  
  .night .block {
    background: url(../img/night_bg_sp.png) no-repeat;
    background-size: cover;
  }
  
  .hotel::after, .spa::after, .casino::after, .night::after {
  right: 0.5rem;
  left: inherit;
}
  
  #night .text_all {
    padding-top: 5rem;
}
  
  .block {
    position: relative;
    padding: 3rem;
    top: inherit;
    transform: inherit !important;
  }
  
  .block::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,.8);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  
  
  .right_b, .left_b {
    right: inherit;
    left: inherit;
  }
  
  .text_all {
    width: 100vw;
    padding: 0 3rem;
    box-sizing: border-box;
  }
  
  .text_all .title {
    font-size: 5.5vw;
  }
  
  .text_all .title span {
    font-size: 3vw;
  }
  
  .text_all .copyright::after {
    bottom: -6vw;
    right: 2vw;
}
  
  .four_star::after, .five_star::after {
    font-size: 3vw;
  }
  
  video.monaco_video {
    width: 95vw;
  }
  
  .app img, .google img {
    width: 50vw;
    height: auto;
    margin: 3rem auto 0;
}
  
  .app_icn {
    margin: 0;
  }
  
  div#app_all .bikou {
    padding: 0 3rem;
}
  
  .app_info .text {
    padding-top: 3rem;
}
  
  #access .bikou {
    padding: 0 3rem;
}
  
  #attention {
    width: 95vw;
    padding: 5rem 3rem;
  }

  #attention .text a {
    font-size: 3.5vw;
  }
  
  #campaign {
    background: url(../img/campaign_bg_sp.png) no-repeat;
    background-size: cover;
  }
  
  #campaign .text {
    padding: 0 3rem;
}
  
  .campaign_img {
    width: 95vw;
  }
  
   .map_img {
  width: 700px;
  height: auto;
 }
  
  .btn a, .btn-open {
    width: 95vw;
  }

  .btn-open .title {
    font-size: 3.5vw !important;
  }
  
  .popup {
    width: 100vw;
  }
  
  .popup-content {
    padding: 4rem;
  }
  
  .popup .text a {
    font-size: 3.5vw;
  }
  
  .icon-close {
    font-size: 6vw;
    padding: 2vw;
  }
  
  .btn-close {
    width: 80vw;
    font-size: 3.5vw;
    padding: 3.5vw;
  }
  
  .popup::-webkit-scrollbar {
    width:2rem;
  }
  
}


