@charset "utf-8";

/* コンテンツ幅 フル */
.contentsInr { width: auto; padding: 0px; }

@media all and (max-width: 739px){
	.clockenflap .ctm_contentsFull { padding: 30px 0; }	
}

/* コンテンツ幅 950px */
.contentsInr .contentsUnit { padding: 0 10px; margin: 0 auto; }

@media all and (min-width: 740px){
	.contentsInr .contentsUnit { width: 950px; padding: 0px; margin :0 auto; }
}

/* font */
.clockenflap .ff_01 { font-family: "Poppins", sans-serif; font-weight: 700; font-style: normal; }

@media all and (max-width: 739px){
	.alC_forSP { text-align: center; }
}
@media all and (min-width: 740px){
	.alC_forPC { text-align: center; }
}

/* icon */
.clockenflap .material-symbols-outlined { font-variation-settings: 'wght' 400; vertical-align: middle; }

/* iconTxt */
.clockenflap [class^="ctm_iconTxt_br"] { display: inline-block; padding: 3px 1.0rem 1px; color: #fff; border-radius: 4px; letter-spacing: 0.1rem; }
.clockenflap .table_typeA [class^="ctm_iconTxt_br"] { line-height: 1.6; }

.clockenflap .txtLimited { position: absolute; display: inline-block; transform: rotate(-10deg); padding: 0.2em 0.5em 0.1em 0.5em; font-weight: bold; color: #009f95; background: #fff; border: 2px solid #009f95; }

/* list */
@media all and (min-width: 740px){
	.clockenflap .listSide ul { display: flex; justify-content: center; }
	.clockenflap .listSide ul > li + li { margin: 0 0 0 2.0rem; }
	
	.clockenflap .listC { text-align: center; }
	.clockenflap .listC li { display: inline-block; }
}

.clockenflap .listFree > ul > li { padding: 0!important; }
.clockenflap .listFree > ul > li:before { display: none; }

/* ctm_pageTtl */
.clockenflap .ctm_pageTtl.hc01 .ttlLv1 { margin: 0; padding: 10px 0 30px; color: #222; position: relative; }
.clockenflap .ctm_pageTtl.hc01 .ttlLv1 .heading { font-size: 2.6rem; position: relative; display: inline-block; z-index: 100; }
.clockenflap .ctm_pageTtl.hc01 .ttlLv1 .ff_01 { font-size: 6.4rem; }
.clockenflap .ctm_pageTtl.hc01 .ttlLv1 .fs_01 { font-size: 2.4rem; }

@media all and (min-width: 740px){
	.clockenflap .ctm_pageTtl.hc01 .ttlLv1 .heading { font-size: 3.2rem; }
}






/* caption */
.clockenflap .imgParts figcaption { font-size: 1.2rem; }

/* table */
.clockenflap .table_typeA .ttlLv4 { margin-bottom: 0; padding-top: 0; line-height: 2.4rem; }

.table .table_typeA li { line-height: 1.5; }

.clockenflap .table_type_B table { border: none; }
.clockenflap .table_type_B th,
.clockenflap .table_type_B td { padding: 10px 0; border: none; border-top: 1px solid #009f95; }
.clockenflap .table_type_B table tr th:first-child,
.clockenflap .table_type_B table tr td:first-child,
.clockenflap .table_type_B table tr:first-child td { border: none; border-top: 1px solid #009f95; }
.clockenflap .table_type_B th { font-size: 1.4rem; color: #009f95; background: #fff; }
.clockenflap .table_type_B td { background: #fff; }

.clockenflap .table_type_C table { border: none; }
.clockenflap .table_type_C tr th { border-right: 1px solid #fff; border-left: none; border-top: none; background: #008180; color: #fff; }
.clockenflap .table_type_C tr th:first-child { border-left: none; }
.clockenflap .table_type_C tr th:last-child { border-right: none; }
.clockenflap .table_type_C tr td { border: 1px solid #008180; border-left: none; border-top: none; background: #fff; }
.clockenflap .table_type_C tr:first-child td { border-top: 1px solid #008180; }
.clockenflap .table_type_C tr td:first-child { border-left: 1px solid #008180; }

@media all and (max-width: 739px){
	.clockenflap .table_type_R th,
	.clockenflap .table_type_R td { width: 100%; display: block; }
}

@media all and (min-width: 740px){

}

/* Botton type horizon */
.clockenflap .ctm_btnList_horizon .btnBox { display: block; width: 100%; height: 100%; }
.clockenflap .ctm_btnList_horizon .col > div { height: 100%; }
.clockenflap .ctm_btnList_horizon .col .btn { display: table; width: 100%; height: 100%; padding-top: 10px; padding-bottom: 10px; margin-top: 0px; }
.clockenflap .ctm_btnList_horizon .col .btnInr { display: table-cell; vertical-align: middle; width: 100%; height: 100%; }

/* anchorList */
.clockenflap .anchorList .btnBK .btn {  }
@media all and (max-width: 739px){
	.clockenflap .anchorList .btn { margin-top: 0; }
}

/* box */
.ctm_msgBarRD .ttlLv4 { margin-bottom: 5px; padding-top: 10px; line-height: 1.5; }



/* MV */
#MV { padding-bottom: 26px; color: #fff; background: #222; }

#MV .ctm_pageTtl .ttlLv1 { margin: 12px 0 0; color: #47ffd7; }
#MV .ctm_pageTtl .ttlLv1 .heading { font-size: 2.6rem; }
@media all and (min-width: 740px){
	#MV .ctm_pageTtl .ttlLv1 .heading { font-size: 3.8rem; }
}

#MV .listFree li { text-align: center; font-size: 1.8rem; }



/* Teaser */
#Teaser.ctm_contentsFull { padding: 0; color: #fff; background: #ff8bb8; }

#Teaser .contentsUnit { padding: 20px 0; background: #ff3180; clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%); }
@media all and (min-width: 740px){
	#Teaser .contentsUnit { padding: 50px 0; }
}

#Teaser .ctm_pageTtl .ttlLv1 { margin: 0 0 0; }
@media all and (max-width: 739px){
	#Teaser .ctm_pageTtl .ttlLv1 .heading { font-size: 3.0rem; }
}



/* Lead */
#Lead.ctm_contentsFull { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/contents_bg01.png?v=0); background-size: 78%; background-repeat: no-repeat; background-position: top 0px left -24px; background-color: #fcf7d7; border-bottom: 1px solid #333; position: relative; padding-bottom: 0; }
@media all and (min-width: 740px){
	#Lead.ctm_contentsFull { background-size: 40vw; background-position: top 0px left -38px; }	
}

#Lead .ctm_pageTtl .ttlLv1 .heading { color: #ff3180; }
#Lead .logoWrap { margin: 0 auto; width: 90%; }
@media all and (min-width: 740px){
	#Lead .logoWrap { width: 56%; }
}

#Lead .ctm_alternatBox.ab01 { color: #fff; background: #fd619e; position: relative; z-index: 50; }
#Lead .ctm_alternatBox .column .colWrap > .col:nth-child(1) .ctm_alternatBox_inr { padding: 20px; }
@media all and (min-width: 740px){
	#Lead .ctm_alternatBox .column .colWrap > .col:nth-child(1) .ctm_alternatBox_inr { max-width: 475px; margin-left: auto; padding: 4% 3% 4% 0; }
}

#Lead .commentBlock { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/contents_bg02.png?v=1); background-size: 78%; background-repeat: no-repeat; background-position: bottom 0px right -24px; padding-bottom: 50px; }
@media all and (min-width: 740px){
	#Lead .commentBlock { background-size: 40vw; background-position: bottom 0px right -78px; }	
}

@media all and (min-width: 740px){
	#Lead .commentBlock .clm_1_2col { margin: 0 auto; width: 88%; }
	#Lead .commentBlock .clm_1_2col .col:nth-of-type(1) { width: calc(28% - 15px); }
	#Lead .commentBlock .clm_1_2col .col:nth-of-type(2) { width: calc(72% - 15px); }
}

#Lead .commentBlock .clm_1_2col .col:nth-of-type(1) img { border-radius: 100vh; }
@media all and (max-width: 739px){
	#Lead .commentBlock .clm_1_2col .col:nth-of-type(1) img { margin: 0 auto; display: block; width: 65%; }
}

#Lead .commentBlock em { color: #222; }
#Lead .commentBlock strong { color: #009f95; }

#Lead .commentBlock .chatBox { position: relative; display: inline-block; padding: 16px; color: #fff; background: #009f95; border-radius: 8px; }
#Lead .commentBlock .chatBox:after { content: ""; position: absolute; top: 0; left: 50%; border-style: solid; 
border-width: 0 12px 16px 12px; border-color: transparent transparent #009f95; translate: -50% -100%; }
@media all and (max-width: 739px){
	#Lead .commentBlock .chatBox { margin-top: 10px; }
}
@media all and (min-width: 740px){
	#Lead .commentBlock .chatBox:after { top: 50%; left: 0; border-width: 12px 14px 12px 0; 
	border-color: transparent #009f95 transparent transparent; translate: -100% -50%; }
}

#Lead .commentBlock .chatBox li { display: inline-block; }





/* Navi */
#Navi.ctm_contentsFull { background: #fff; }




/* Point */
#Point.ctm_contentsFull { background-color: #d8f8f1; border-top: 1px solid #333; position: relative; }

#Point .ctm_pageTtl.hc01 .ttlLv1 { }

#Point strong { color: #ff3180; }

#Point .txtLimited { background: #222; border: none; box-shadow: 6px 6px 0px 0px rgb(71 255 215 / 1.0); }
#Point .txtLimited,
#Point .txtLimited ul li { color: #47ffd7 !important; font-size: 1.8rem; }

#Point .pointListBlock { position: relative; margin-top: 14px; background-color: #fff; border: 4px solid #333; border-radius: 20px; box-shadow: 10px 10px 0 0 rgb(0 0 0 / 0.16); }

#Point .pointListBlockInr { position: relative; padding: 20px 22px; }
#Point .pointListBlockInr.type_A { padding: 20px 22px; }
#Point .pointListBlockInr.type_B { padding: 20px 22px 22px; }
@media all and (min-width: 740px){
	#Point .pointListBlock { }

	#Point .pointListBlockInr { padding: 30px 30px; }
	#Point .pointListBlockInr.type_A { padding: 30px 30px; }
	#Point .pointListBlockInr.type_B { padding: 30px 30px 34px; }
}

#Point_01:before { content: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/point01_heading01.png?v=3); }
#Point_02:before { content: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/point02_heading01.png?v=3); }
#Point_03:before { content: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/point03_heading01.png?v=3); }
#Point .pointListBlock:before { transform: scale(0.28); position: absolute; top: -152px; left: -126px; }
@media all and (min-width: 740px){
	#Point .pointListBlock:before { transform: scale(0.40); top: -136px; left: -110px; }
}

#Point .pointListBlock .ctm_pageTtl .ttlLv2 { margin-top: 10px; padding: 0 0 10px 56px; text-align: left; }
#Point .pointListBlock .ctm_pageTtl .ttlLv2 .heading { display: inline-block; position: relative; }
#Point .pointListBlock .ctm_pageTtl .ttlLv2 .fs_01 { font-size: 1.6rem; }
@media all and (max-width: 739px){
	#Point .pointListBlock .ctm_pageTtl .ttlLv2 .heading { font-size: 2.4rem; }
}
@media all and (min-width: 740px){
	#Point .pointListBlock .ctm_pageTtl .ttlLv2 { margin-top: 24px; padding-left: 80px; text-align: center; }
	#Point .pointListBlock .ctm_pageTtl .ttlLv2 .fs_01 { font-size: 2.2rem; }
}

@media all and (min-width: 740px){
	#Point .table_typeA table { width: 100%; }
}

#Point .table_type_B td {  }
@media all and (max-width: 739px){
	#Point .table_type_B.table_type_R th { width: 100%; }
	#Point .table_type_B.table_type_R td { padding-top: 0; border-top: none; }
}
@media all and (min-width: 740px){

}

/** Point_01 **/

@media all and (max-width: 739px){
	/*
	#Point #Point_01 .ctm_pageTtl .ttlLv2 { padding-left: 0; text-align: right; }
	#Point #Point_01 .ctm_pageTtl .ttlLv2 .fsS_01 { line-height: 2.2; }
	*/
}

#Point_01 .dpBox { padding: 14px 10px; background: #fffbdf; border: 1px solid #333; }
@media all and (min-width: 740px){
	#Point_01 .dpBox { padding: 20px; }
	/*
	#Point_01 .dpBox .imgParts { margin: 0 auto; display: block; width: 80%; }
	*/
}


/** Point_02 **/
@media all and (max-width: 739px){
	#Point_02.pointListBlock .txtLimited { top: -28px; right: 16px; }
}
@media all and (min-width: 740px){
	#Point_02.pointListBlock .txtLimited { top: 4px; left: 134px; font-size: 2.0rem; }
}

/** Point_03 **/
#Point_03 { padding-bottom: 30px; }

@media all and (min-width: 740px){
	#Point_03 .detailBox_01 .clm_1_2col .col:nth-of-type(1) { width: calc(30% - 15px); }
	#Point_03 .detailBox_01 .clm_1_2col .col:nth-of-type(2) { width: calc(70% - 15px); }
	#Point_03 .detailBox_02 .clm_1_2col .col:nth-of-type(1) { width: calc(70% - 15px); }
	#Point_03 .detailBox_02 .clm_1_2col .col:nth-of-type(2) { width: calc(30% - 15px); }
}

#Point_03 .tbl_col_1 { width: 12%; }
@media all and (min-width: 740px){
	#Point_03 .tbl_col_1 { width: 18%; }
}

#Point_03 .pointListBlockInr.type_B { background: #fd619e; }
@media all and (max-width: 739px){
	#Point_03 .pointListBlockInr.type_B { padding-top: 96px; }
}
@media all and (min-width: 740px){
	#Point_03 .pointListBlockInr.type_B .widWrap_01 { margin: 0 auto; width: 88%; }
}

#Point_03 .type_B .txtLimited { transform: rotate(-8deg); }
@media all and (max-width: 739px){
	#Point_03 .type_B .txtLimited { top: 2px; left: -10px; }
}
@media all and (min-width: 740px){
	#Point_03 .type_B .txtLimited { top: -62px; right: -10px; }
}

#Point_03 .type_B .ctm_pageTtl .ttlLv3 { margin: 0; padding: 0 0 10px; border-bottom: 3px solid #fff; color: #fff; }
#Point_03 .type_B .ctm_pageTtl .ttlLv3 .heading { padding: 0; font-size: 2.0rem; }
#Point_03 .type_B ul li { color: #fff; }
@media all and (min-width: 740px){

}


#Point .btnBK .btn { }
#Point .btnBK .btn strong { }



/* Schedule */
#Schedule.ctm_contentsFull { /* background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/intltour/chn/hkg_mfm/clockenflap/img_sites/contents_bg01.png?v=0); background-size: 78%; background-repeat: no-repeat; background-position: top 0px left -24px; */ background-color: #f9e7ec; border-top: 1px solid #333; position: relative; }
/*
@media all and (min-width: 740px){
	#Schedule.ctm_contentsFull { background-size: 32vw; background-position: top 0px left -38px; }	
}
*/
 
/*
#Schedule .ctm_pageTtl.hc01 .ttlLv1 {  }
#Schedule .ctm_pageTtl.hc01 .ttlLv1:before,
#Schedule .ctm_pageTtl.hc01 .ttlLv1:after { background-color: #f6e9af; }
*/

#Schedule .table_type_C .tbl_col_1,
#Schedule .table_type_C .tbl_col_2 { width: 14%; }
#Schedule .table_type_C .tbl_col_4 { width: 20%; }

#Schedule .table_type_C th { text-align: center; }
#Schedule .table_type_C .JS_subTitle { text-align: center; background: #fffbdf !important; }
#Schedule .table_type_C .JS_subTitle .txtcmpSubTitle { font-weight: bold; }
#Schedule .table_type_C tr td:nth-of-type(5) { text-align: center; }

#Schedule .table_type_C .txtStay { color: #009f95; }
#Schedule .table_type_C .ctm_iconTxt_br_BK { }
#Schedule .table_type_C .ctm_iconTxt_br_F  { font-size: 1.6rem; background: #fd619e; }

#Schedule .table_type_C .fsS { font-size: 1.2rem !important; }

#Schedule .listSchedule_01.listFree > ul > li { display: flex; }
#Schedule .listSchedule_01 .txtTime { display: inline-block; color: #008180; width: 3.5em; }

#Schedule .listMeal.listFree > ul > li { text-indent: -2.0em; padding-left: 2.0em!important; }

#Schedule table strong { color: #ff3180; }
#Schedule table em { color: #009f95; }

/*
#Schedule .table_type_C .txtColspan { white-space: nowrap; width: 400px; }
#Schedule .table_type_C tbody tr:nth-of-type(4) td:nth-of-type(1),
#Schedule .table_type_C tbody tr:nth-of-type(4) td:nth-of-type(2) { border-right: none; }
*/



/* Hotel */
#Hotel.ctm_contentsFull { background: #fff; border-top: 1px solid #333; }

/*
#Hotel .ctm_pageTtl.hc01 .ttlLv1:before,
#Hotel .ctm_pageTtl.hc01 .ttlLv1:after { background-color: #f6e9af; }
*/

#Hotel .ctm_bdrColumn .col { position: relative; background: #fff; }

#Hotel .ctm_bdrColumn .ttlLv2 h3 { font-size: 1.8rem; }

@media all and (min-width: 740px){
	#Hotel .acodBlock .clm_1_3col.colWrap .col:nth-of-type(1),
	#Hotel .acodBlock .clm_1_3col.colWrap .col:nth-of-type(3) { width: 250px; }
	#Hotel .acodBlock .clm_1_3col.colWrap .col:nth-of-type(2) { width: 400px; }
}

#Hotel [class^="btn_color"] { display: inline-block; padding: 3px 6px 1px; font-size: 1.2rem; color: #000 !important; font-weight: bold !important; }
#Hotel .btn_colorS { background-color: #caaa49; }
#Hotel .btn_colorL { background-color: #327bf3; }
#Hotel .btn_colorA { background-color: #f79155; }
#Hotel .btn_colorB { background-color: #efcf02; }
#Hotel .btn_colorC { background-color: #9b9baa; }

#Hotel .ctm_iconTxt_br_F { font-size: 1.4rem; }



/* Apply */
.applyBlock .tbl_col_1 { width: 25%; }



.contentsInr .ticketModule_unit {
  margin: 10px -10px 0 -10px !important;
}
@media screen and (min-width: 740px) {
  .contentsInr .ticketModule_unit {
    margin: 10px 0 0 0 !important;
  }
}


@media all and (max-width: 739px){
	.clockenflap .js-eqHeightCols .js-eqHeightCols-item,
	.clockenflap .js-eqHeightCols .js-eqHeightCols-item-2,
	.clockenflap .js-eqHeightCols .js-eqHeightCols-item-3,
	.clockenflap .js-eqHeightCols .js-eqHeightCols-item-4 { height: auto!important; }
}

@media all and (max-width: 739px){
}
@media all and (min-width: 740px){
}
