@charset "utf-8";

.fs11 { font-size: 1.1rem !important; }
.fs13 { font-size: 1.3rem !important; }
.fs15 { font-size: 1.5rem !important; }

.fsS ul li { font-size: 1.2rem; }

/* コンテンツ幅 フル */
.contentsInr { width: auto; padding: 0px; }

@media all and (max-width: 739px){
	.ctm_contentsFull { padding: 30px 0; }
}

/* コンテンツ幅 950px */
.contentsInr .contentsUnit,
.contentsInr .module { padding: 0 10px; margin: 0 auto; }

@media all and (min-width: 740px){
	.contentsInr .contentsUnit,
	.contentsInr .module { width: 950px !important; padding: 0px; margin: 0 auto; }
	.contentsInr .module { float: none !important; }
}

.alivila-special .contentsUnit_bg { position: relative; }
.alivila-special .contentsUnit_bg:before { position: absolute; content: ''; display: inline-block; width: 470px; /* height: 212px; */ height: 198px; top: -50px; }
@media all and (max-width: 739px){
	.alivila-special .contentsUnit_bg:before { top: -30px; }
	#Point .contentsUnit_bg:before { height: 158px; }
}

#Point  .contentsUnit_bg:before,
#Option .contentsUnit_bg:before { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/oka/alivila-special/img_sites/contents_bg01.png); background-size: contain; background-repeat: no-repeat; left: 20px; }

#Room .contentsUnit_bg:before { background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/oka/alivila-special/img_sites/contents_bg02.png); background-size: contain; background-repeat: no-repeat; right: 20px; }

/* icon */
.material-symbols-outlined { font-variation-settings: 'wght' 200; }

.alivila-special [class^="ctm_iconTxt"] { padding: 3px 6px 1px; }
.alivila-special ul li [class^="ctm_iconTxt"] { padding: 2px 6px 0px; }

.alivila-special .ctm_iconTxt_bd_RD { color: #c00; border: 1px solid #c00; background: #fff; }

/* font */
@media all and (min-width: 740px){
	.alC_forPC { text-align: center; }
}

/* list */
@media all and (min-width: 740px){
	.alivila-special .listSide ul { display: flex; justify-content: center; }
	.alivila-special .listSide ul > li + li { margin: 0 0 0 2.0rem; }
	
	.alivila-special .listC { text-align: center; }
	.alivila-special .listC li { display: inline-block; }
}

.alivila-special .listF > ul > li { padding: 0!important; }
.alivila-special .listF > ul > li:before { display: none; }

/* ctm_pageTtl */
.alivila-special .ctm_pageTtl { position: relative; }
.alivila-special .ctm_pageTtl .heading { font-family: "Shippori Mincho", serif; font-style: normal; font-weight: 700; letter-spacing: 0.05em; }
.alivila-special .ctm_pageTtl h2.heading { letter-spacing: 0.1em; }

.alivila-special .ctm_pageTtl .ttlLv1 { margin-top: 20px; }
.alivila-special .ctm_pageTtl .ttlLv1 h2 { color: #9a7f2d; }
.alivila-special .ctm_pageTtl .ttlLv1 h2 span { font-size: 80%; color: #b69d54; }
.alivila-special .ctm_pageTtl .ttlLv3 h4 { font-size: 2.0rem; }
@media all and (max-width: 739px){
	.alivila-special .ctm_pageTtl .ttlLv1 h2 { font-size: 3.2rem; }
	.alivila-special .ctm_pageTtl .ttlLv2 h3,
	.alivila-special .ctm_pageTtl .ttlLv3 h4,
	.alivila-special .ctm_pageTtl .ttlLv4 h5 { letter-spacing: 0.02em; }
}
@media all and (min-width: 740px){
	.alivila-special .ctm_pageTtl .ttlLv2 h3 { font-size: 2.4rem; }
}

.alivila-special .ttlLv4 { line-height: 1.5; }

/* box */
.attentionBox { padding: 10px; background: #fff5b2; }
.bdrBox_RD { padding: 10px 20px; border: 1px solid #c00; }

/* table */
.alivila-special .table_typeA .ttlLv4 { margin-bottom: 0; padding-top: 0; line-height: 2.4rem; }

.alivila-special .table_typeA .noteList li { line-height: 1.5; }

.alivila-special .table_type_B .table_typeA,
.alivila-special .table_type_B table,
.alivila-special .table_type_B tr th,
.alivila-special .table_type_B tr td { background: transparent; border: none; }
.alivila-special .table_type_B tr:first-child th,
.alivila-special .table_type_B tr:first-child td { border-top: 1px solid #2fa469; }
.alivila-special .table_type_B tr th:first-child,
.alivila-special .table_type_B tr td:first-child { border-left: none; }
.alivila-special .table_type_B tr th { color: #2fa469; border-bottom: 1px solid #2fa469; }
.alivila-special .table_type_B tr td { border-bottom: 1px solid #2fa469; }

.alivila-special .table_type_C table { border: none; }
.alivila-special .table_type_C tr th { border-right: 1px solid #fff; border-left: none; border-top: none; background: #007bc8; color: #fff; }
.alivila-special .table_type_C tr th:first-child { border-left: none; }
.alivila-special .table_type_C tr th:last-child { border-right: none; }
.alivila-special .table_type_C tr td { border: 1px solid #007bc8; border-left: none; border-top: none; background: #fff; }
.alivila-special .table_type_C tr:first-child td { border-top: 1px solid #007bc8; }
.alivila-special .table_type_C tr td:first-child { border-left: 1px solid #007bc8; }

/* slide */
#Point .pointListBlock .slick-list li,
#Option .optionListBlock .slick-list li { position: relative; }
#Point .pointListBlock .slick-list li:after,
#Option .optionListBlock .slick-list li:after { content: ""; position: absolute; bottom: 1px; left: 10px; font-size: 1.1rem; color: #fff; text-shadow: 1px 1px 8px rgba(0, 0, 0, 1.0); }

.alivila-special .slick-box .slidControl { padding: 7px 10px !important; bottom: 20px; }
@media all and (min-width: 740px){
	.alivila-special .slick-box .slidControl { padding: 6px 15px 7px 10px !important; }
}

/* caption */
@media all and (max-width: 739px){
	.alivila-special .imgParts figcaption { font-size: 1.4rem; }
}

/* hero_img */
.hero_img { background: #ff8864; }



/* Lead */
#Lead.ctm_contentsFull { padding: 0 0 30px; color: #fff; background: #ff8864; }

#Lead .txtPeriod { font-size: 1.6rem; text-align: center; }
#Lead .txtPeriod em,
#Lead .txtPeriod span { display: inline-block; }

#Lead .ctm_pageTtl .ttlLv1 { margin: 15px 0 0; border-top: 3px double #fff; }
#Lead .ctm_pageTtl .ttlLv1 h2 { font-size: 2.0rem; color: #fff; }
@media all and (max-width: 739px){
	#Lead .ctm_pageTtl h2.heading { font-size: 1.8rem; letter-spacing: 0.02em; }
	#Lead .ctm_pageTtl h2.heading em { padding-top: 1.0rem; display: inline-block; }
}




/* Navi */
#Navi.ctm_contentsFull { background: #fff; }

#Navi .linkbtn.btnBox.btnRD.btnSrg .btn { border: 1px solid #cfc06f; }
#Navi .linkbtn.btnBox.btnRD.btnSrg .btn:before { content: ''; position: absolute; top: 0; left: 0;
width: 36px; aspect-ratio: 1; clip-path: polygon(0 0,100% 0,0 100%); background: #cfc06f; }



/* Point */
#Point.ctm_contentsFull { background: #f3efdb; }

#Point .ctm_pageTtl .ttlLv2 { margin-top: 0; }
#Point .ctm_pageTtl .ttlLv2 h3 { letter-spacing: 0.1em; }
#Point .ctm_pageTtl .ttlLv2 h3 strong { font-size: 4.2rem; padding-left: 0.1em; }

#Point .tabs_parent > li > a { background: #fff; }
#Point .tabs_parent > li.current > a { background: #b10000; }

@media all and (min-width: 740px){
	#Point .naviBlock .clm_1_2col { margin: 0 auto; width: 70%; }
}

#Point .naviBlock .col { padding: 0 18px 18px; border: 1px solid #b69d54; background: #fff; border-radius: 20px; box-shadow: 10px 10px 20px 0 rgba(0, 0, 0, 0.1); }

#Point .naviBlock .ctm_pageTtl .ttlLv2 h3 { font-size: 2.2rem; border-bottom: 3px double #cfc06f; }
#Point .naviBlock .ctm_pageTtl .ttlLv2 h3 strong { color: #b69d54; }

#Point .naviBlock .ttlLv4 { margin: 0; padding: 0; font-weight: normal; text-align: center; }

#Point .naviBlock .pointIcon { color: #cfc06f; }
#Point .naviBlock .pointIcon .ttlLv4 { line-height: 1.0; }
#Point .naviBlock .pointIcon .material-symbols-outlined { font-size: 4.0rem; }

#Point .naviBlock .btnBK .btn { background: #9a7f2d; }
#Point .naviBlock .col .btnBK .btn { background: #b69d54; }

#Point .naviBlock .fcRD { color: #ea5433 !important; }
#Point .naviBlock .ctm_pageTtl .ttlLv2 h3 .fcRD { color: #ff7b53 !important; font-size: 1.6rem; }

#Point .pointListBlock { padding: 20px 24px; background: #fff; border-radius: 20px; box-shadow: 10px 10px 20px 0 rgba(0, 0, 0, 0.1); }
@media all and (min-width: 740px){
	#Point .pointListBlock { padding: 20px 30px; }
}

#Point .pointListBlock .ctm_pageTtl { text-align: left; }
#Point .pointListBlock .ctm_pageTtl h3 { display: inline-block; position: relative; height: 2.4em; line-height: 2.0em; padding: 0 40px 0 30px; margin-left: -24px; background: #ff7b53 !important; color: #fff; box-sizing: border-box; }
#Point .pointListBlock .ctm_pageTtl h3:after { content: ''; position: absolute; width: 0px; height: 0px; 
z-index: 1; top: 0; right: 0; border-width: 1.2em 0.6em 1.2em 0; border-color: transparent #fff transparent transparent; border-style: solid; }
#Point .pointListBlock .ctm_pageTtl h3 strong { color: #fff; }
@media all and (min-width: 740px){
	#Point .pointListBlock .ctm_pageTtl h3 { line-height: 2.2em; margin-left: -30px; }
}

#Point .pointListBlock .ctm_pageTtl .ttlLv3 { margin-top: 0; padding: 0; }
@media all and (min-width: 740px){
	#Point .pointListBlock .ctm_pageTtl .ttlLv3 {}
}
#Point .pointListBlock .ctm_pageTtl h4 { padding: 0; }
#Point .pointListBlock .ctm_pageTtl h4 strong { color: #ff7b53; }

#Point .pointListBlock .imgParts { padding: 10px 5px 15px; position: relative; }
#Point .pointListBlock figcaption { position: absolute; bottom: 16px; left: 10px; font-size: 1.1rem; color: #fff; text-shadow: 1px 1px 8px rgba(0, 0, 0, 1.0); }

/** Point_01 **/
#Point_01_t02 .slick-list li:nth-child(n+2):after { content: "（イメージ）"; }

/** Point_02 **/


/** Point_03 **/
#Point_03_t02 .slick-list li:nth-child(2):after { content: "トップフロアオーシャンパティオ（一例）"; }
#Point_03_t02 .slick-list li:nth-child(3):after { content: "オーシャンフロント（一例）"; }
#Point_03_t02 .slick-list li:nth-child(4):after { content: "オーシャンフロント（一例）"; }

/** Point_04 **/
/*
#Point_04_t01 .slick-list li:nth-child(2):after { content: "トップフロアオーシャンパティオ（一例）"; }
#Point_04_t01 .slick-list li:nth-child(3):after { content: "オーシャンフロント（一例）"; }
#Point_04_t01 .slick-list li:nth-child(4):after { content: "オーシャンフロント（一例）"; }
*/

#Point .infoBlock { padding: 20px 24px; background: #fff; border: 1px solid #b69d54; }
@media all and (min-width: 740px){
	#Point .pointListBlock { padding: 20px 30px; }
}

#Point .infoBlock .ctm_pageTtl .ttlLv2 h3 { padding-bottom: 5px; color: #ac8f3b; border-bottom: 3px double #cfc06f; }




/* Room */
#Room.ctm_contentsFull { background: #fff; }

#Room .ctm_pageTtl .ttlLv2 { margin-top: 20px; border-bottom: 3px double #ffa286; }
#Room .ctm_pageTtl .ttlLv2 h3 sub { color: #b69d54; }
@media all and (max-width: 739px){
	#Room .ctm_pageTtl .ttlLv2 h3 { letter-spacing: 0.02em; }
}
@media all and (min-width: 740px){
	#Room .ctm_pageTtl .ttlLv2 {  }
}

#Room .ctm_pageTtl .ttlLv3 { margin-top: 0; color: #ff7b53; }
#Room .ctm_pageTtl .ttlLv3 h4 { font-size: 1.8rem; }

#Room .ctm_alternatBox_WT {}
@media all and (max-width: 739px){
	#Room .ctm_alternatBox_WT .ctm_alternatBox_inr { padding: 10px 10px 40px; }
}

#Room .ctm_alternatBox_WT .imgParts { position: relative; }
#Room .ctm_alternatBox_WT figcaption { position: absolute; bottom: 1px; font-size: 1.1rem; color: #fff; text-shadow: 1px 1px 8px rgba(0, 0, 0, 1.0); }

@media all and (max-width: 739px){
	#Room .ctm_alternatBox_WT .clm_1_2col .col:nth-child(1) figcaption { left: 10px; }
}
@media all and (min-width: 740px){
	#Room .ctm_alternatBox_WT .clm_1_2col .col:nth-child(1) figcaption { right: 10px; }
}
#Room .ctm_alternatBox_WT .clm_1_2col .col:nth-child(2) figcaption { left: 10px; }

#Room .alivilaBlock { padding: 6px; background: #f3efdb; }
#Room .alivilaBlock .alivilaBlockInr { padding: 10px; border: 2px solid #fff; background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/oka/alivila-special/img_sites/room_alivila_bg01_sp.png?v=1); background-size: 100%; background-position: bottom; background-repeat: no-repeat; }
#Room .alivilaBlock .ctm_pageTtl .ttlLv2 { border-bottom: 3px double #fff; }
@media all and (max-width: 739px){
	#Room .alivilaBlock .ctm_pageTtl .ttlLv2 { margin: 8px 0 12px; }
}
@media all and (min-width: 740px){
	#Room .alivilaBlock { padding: 12px; }
	#Room .alivilaBlock .alivilaBlockInr { padding: 12px; background-image: url(/content/dam/sites/wwwjalcojp/jp/ja/domtour/jaldp/oka/alivila-special/img_sites/room_alivila_bg01_pc.png?v=1); }
}

@media all and (max-width: 739px){
	#Room .alivilaBlock .slick-box .slidControl { bottom: 8px; }
}



/* Option */
#Option.ctm_contentsFull { background: /* #d8f1f9 */#dcf8ea; }

#Option .ctm_pageTtl .ttlLv4 { margin: 0; padding-top: 5px; }
#Option .ctm_pageTtl .ttlLv4 h5 { font-size: 1.8rem; }

#Option .optionListBlock { padding: 0 24px 24px; border: 1px solid #b69d54; background: #fff; border-radius: 20px; box-shadow: 10px 10px 20px 0 rgba(0, 0, 0, 0.1); }
@media all and (min-width: 740px){
	#Option .optionListBlock { padding: 0 30px 30px; }
}

#Option .optionListBlock .ctm_pageTtl .ttlLv2 { margin-top: 30px; }

#Option .optionListBlock .ctm_pageTtl .ttlLv3 { margin: 30px 0 10px; padding-top: 5px; border-top: 3px double #2fa469; }
#Option .optionListBlock .ctm_pageTtl .ttlLv3 h4 { color: #2fa469; }

#Option .optionListBlock .tbl_col_1 { width: 32%; }
@media all and (min-width: 740px){
	#Option .optionListBlock .tbl_col_1 { width: 25%; }
}

@media all and (min-width: 740px){
	#Option .optionListBlock .scheduleWrap .clm_1_2col .col:nth-child(1) { width: calc( 6% - 5px); }
	#Option .optionListBlock .scheduleWrap .clm_1_2col .col:nth-child(2) { width: calc(94% - 5px); margin-left: 10px; }
}
#Option .optionListBlock .scheduleWrap strong { color: #048484; }
#Option .optionListBlock .scheduleWrap .fs_A01 { color: #2fa469; font-weight: bold; }

#Option_01 .slick-list li:nth-child(2):after { content: "写真提供：国営沖縄記念公園（海洋博公園）沖縄美ら海水族館"; }
#Option_01 .slick-list li:nth-child(3):after { content: "写真提供：一般財団法人うるま市観光物産協会"; }
@media all and (max-width:739px){
	#Option_01 .slick-list li:nth-child(2):after { content: "写真提供：\A国営沖縄記念公園（海洋博公園）沖縄美ら海水族館"; white-space: pre; }
}




@media all and (max-width:739px){
	.alivila-special .js-eqHeightCols .js-eqHeightCols-item,
	.alivila-special .js-eqHeightCols .js-eqHeightCols-item-2,
	.alivila-special .js-eqHeightCols .js-eqHeightCols-item-3,
	.alivila-special .js-eqHeightCols .js-eqHeightCols-item-4 { height: auto!important; }
}

@media all and (max-width:739px){
}
@media all and (min-width:740px){
}