@charset "UTF-8";
/* -----------------------------------------------------------
CSS Information

File name:      style.css
Created:        2020.04.13
Style Info:     ハワイコンドミニアム特集　CSS
----------------------------------------------------------- */
#condominium_wrapper.content_wrapper {background:#fff;font-weight:normal;color:#333333; font-size: 15px; line-height: 180%;}
#condominium a{text-decoration:none;}
#condominium a:hover{opacity:.75;text-decoration:none;}
#condominium a:active, #condominium a:focus{outline:none;text-decoration:none;}
#condominium img{vertical-align:bottom;width:100%;height:auto;}

#condominium .content {max-width: 1140px; width: 100%; margin: 0 auto; padding: 0;}
#condominium .fo_01 {font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; font-weight: bold; color: #68b2c7; line-height: 1;}
@media screen and (max-width:767px) {
	.breadcrumb_nav{font-size: 11px;}#condominium {line-height: 1.6;}
	#condominium .content {padding: 0 15px;}
	#condominium .fo_01 {line-height: 1.4;}

}
@media screen and (max-width:480px) {
}

/*フォントサイズ*/
#condominium .sec_01 .sec_tit ,
#condominium .sec_02 .wrap_01 li .box_tit ,
#condominium .sec_tourlist .tour_head ,
#condominium .sec_info .sec_tit {font-size: 30px;}
#condominium .sec_02 .sec_tit ,
#condominium .sec_03 .sec_tit {font-size: 40px;}

@media screen and (max-width:1200px) {
	#condominium .sec_02 .wrap_01 li .box_tit {font-size:2.6vw;}
}

@media screen and (max-width:767px) {

	#condominium .sec_01 .sec_tit ,
	#condominium .sec_info .sec_tit ,
	#condominium .sec_tourlist .tour_head {font-size: 5.3vw;}
	#condominium .sec_02 .sec_tit ,
	#condominium .sec_03 .sec_tit {font-size: 6.4vw;}
	#condominium .sec_02 .wrap_01 li .box_tit {font-size: 6vw;}

}

#condominium .btn_link {display: flex; justify-content: flex-end; padding-right: 10px;}
#condominium .btn_link a {background: #68b2c7; color: #fff; width: 355px; height: 45px; display: flex;align-items: center; justify-content: center;  font-size: 16px; position: relative; padding-right: 20px; line-height: 1;}

#condominium .btn_link a:after  {content:""; width: 9px; height: 9px; display: block;border-bottom: solid 1px #fff;border-left: solid 1px #fff; position: absolute; right: 12px; top: 50%; transform: rotate(-45deg) translate(0,-10px);}

/* -------------------------------------------------------- */
/* slider */
/* -------------------------------------------------------- */


.head_bnr {position:relative;margin-bottom:65px;}
.head_bnr h1 {width: 671px; height: 228px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 100;}
.bnr_loader {width:100%;height:100%;margin:0;background:#fff url(../img/load.gif) center center no-repeat;opacity:1;position:absolute;top:0;left:0;z-index:1;}
.head_bnr .bnr_slider {opacity:0;transition:opacity .3s linear;z-index:2;}
.head_bnr .slick-slide {transition:.3s ease;}
.head_bnr .slick-slide:not(.slick-current) a {pointer-events:none;}
.head_bnr .slick-arrow {opacity:0;position:absolute;top:50%;margin-top:-36px;overflow:hidden;padding-top:47px;z-index:10;width:48px;height:48px;background:#fff;border-radius:25px;text-align:center;border:0;}
.head_bnr .slick-next {left:50%;margin-left:690px;}
.head_bnr .slick-prev {right:50%;margin-right:690px;}
.head_bnr .slick-arrow::after {display:block;color:#4d4946;height:100%;width:100%;position:absolute;top:0;left:0;font-size:20px;transform:none;border:4px solid #4d4946;border-radius:25px;content:'';background: url(../img/arr_white.svg) center center / 40% auto no-repeat;aspect-ratio: 8 / 14;width:10px;display: block;padding-left:2px;}
.head_bnr .slick-prev::after {transform: scale(-1, -1);}
.head_bnr .slick-next::after {}
.head_bnr .slick-dots {opacity:0;padding-top:10px;display:flex;align-items:center;justify-content:center;}
.head_bnr .slick-dots li {width:22px;height:22px;display:flex;align-items:center;justify-content:center;}
.head_bnr .slick-dots li button {position:relative;font-size:0;line-height:0;cursor:pointer;width:8px;height:8px;border-radius:4px;margin:0;border:0;padding:0;}
.head_bnr .slick-dots li button::before {display:block;position:absolute;top:0;left:0;content:"";width:8px;height:8px;border-radius:4px;background:#4d4946}
.head_bnr .slick-dots li.slick-active button::before {background:#4d4946;}


#condominium .head_bnr .slick-slide {margin:0 43px;}
#condominium .head_bnr .slick-slide {opacity:.2;}
#condominium .head_bnr .slick-now.slick-current.slick-active {opacity:1;}
#condominium .head_bnr .slick-slide img {max-width:1366px; width: 100%; height:auto;}
#condominium .head_bnr .slick-arrow:hover::after,
#condominium .head_bnr .slick-current:hover img {opacity:.75;}
#condominium .head_bnr .slick-dots {margin:0 auto;width:100%;}
#condominium .head_bnr .slick-dots li:hover button::before {background:#4d4946;}

@media (max-width:757px) {
	.sp_head_bnr {margin-bottom: 6.6vw;}
}


/* スライダーが読み込まれたら表示 */
.bnr_slider.slick-initialized,
.bnr_slider.slick-initialized .slick-arrow,
.bnr_slider.slick-initialized .slick-dots {opacity:1;}



/* ------------------------------------------------ */
/* sec_01*/
/* ------------------------------------------------ */

#condominium .sec_01 {padding-bottom: 70px;}
#condominium .sec_01 .wrap_01 {display: flex; justify-content: space-between; flex-wrap: wrap;}
#condominium .sec_01 .note {width: 570px;}
#condominium .sec_01 figure {width: calc(100% - 640px);}

#condominium .sec_01 .sec_tit { margin-bottom: 30px;}
#condominium .sec_01 p {margin-bottom: 30px;}

@media screen and (max-width:1200px) {
	#condominium .sec_01 {padding: 0 15px 70px;}
	#condominium .sec_01 figure {width: calc(100% - 590px);}

}

@media screen and (max-width:767px) {
	#condominium .sec_01 {padding: 0 0 2.6vw;}
	#condominium .sec_01 .note ,
	#condominium .sec_01 figure {width: 100%}
	#condominium .sec_01 .sec_tit {margin-bottom: 5.3vw;}
	#condominium .sec_01 p {margin-bottom: 2.6vw;}

	#condominium .sec_01 .btn_link {margin-bottom: 5.2vw; padding-right: 0;}
	#condominium .sec_01 .btn_link a {width: 100%;}
}

@media screen and (max-width:320px) {
	#condominium .sec_01 .btn_link a {font-size: 14px; padding-right: 15px;}
	#condominium .btn_link a:after {right: 5px; width: 7px; height: 7px; transform: rotate(-45deg) translate(0,-8px);}
}

/* ------------------------------------------------ */
/* sec_02*/
/* ------------------------------------------------ */

#condominium .sec_02 .sec_tit {text-align: center; margin-bottom: 50px; position: relative; width: 100%;}
#condominium .sec_02 .sec_tit span{position: relative;z-index: 2;}
#condominium .sec_02 .sec_tit:before {content:"";background: url("../img/sec_02_tit_bg.png") no-repeat; background-size: 100%; position: absolute;left: 0; top: -100px; width: 100%; height: 201px; display: block;}

#condominium .sec_02 .wrap_01 {display: flex; justify-content: space-between; padding: 40px 60px 0;background: #edfafd; flex-wrap: wrap;border-radius: 10px;}
#condominium .sec_02 .wrap_01 li {width:calc((100% - 60px) / 2 ); margin-bottom: 45px;}
#condominium .sec_02 .wrap_01 li .box_tit {margin-bottom: 20px;}
#condominium .sec_02 .wrap_01 li p {margin-bottom: 30px;}
#condominium .sec_02 .wrap_01 li figure {background: #68b2c7;}
#condominium .sec_02 .wrap_01 li figcaption {text-align: center; font-size: 13px; color: #fff;line-height: 1.8; padding: 5px;}

@media screen and (max-width:1140px) {

	#condominium .sec_02 .wrap_01 li .box_tit {margin-bottom: 2vw}

}

@media screen and (max-width:767px) {
	#condominium .sec_02 .sec_tit {margin-bottom: 5.3vw;}
	#condominium .sec_02 .sec_tit:before {content:"";background: url("../img/sp_sec_02_tit_bg.png") no-repeat; background-size: 100%; position: relative; width: 100%; height: 23.46vw; top: 0; display: block; margin-bottom: 2.6vw;}

	#condominium .sec_02 .wrap_01 {width: calc(100% + 30px); margin-left: -15px; padding: 15px;}
	#condominium .sec_02 .wrap_01 li {width: 100%; margin-bottom: 10vw;}
	#condominium .sec_02 .wrap_01 li p {margin-bottom: 5.3vw;}
	#condominium .sec_02 .wrap_01 li figcaption {padding: 4px 0;}
}


/* ------------------------------------------------ */
/* sec_03*/
/* ------------------------------------------------ */

#condominium .sec_03 {padding: 80px 0 50px;}
#condominium .sec_03 .sec_tit {text-align: center;  margin-bottom: 50px; width: 100%;}
#condominium .sec_03 p {text-align: center; padding: 0 60px 50px;}
#condominium .sec_03 ul {padding: 0 60px; display: flex; justify-content: space-between;}
#condominium .sec_03 ul li:not(:last-child) {margin-right: 25px;}
#condominium .sec_03 ul li img {margin-bottom: 10px;}
#condominium .sec_03 ul li figcaption {text-align: center; font-size: 18px; }
#condominium .sec_03 ul li figcaption:after  {content:""; width: 9px; height: 9px; display: inline-block;border-bottom: solid 1px #68b2c7;border-left: solid 1px #68b2c7; transform: rotate(-45deg) translate(0,-5px); margin-left: 20px; }


@media screen and (max-width:767px) {
	#condominium .sec_03 {padding: 8.6vw 0 6.6vw;}
	#condominium .sec_03 .sec_tit { margin-bottom: 5.3vw;}
	#condominium .sec_03 p {text-align: left; padding: 0 0 5.3vw;}
	#condominium .sec_03 ul {padding: 0; }
	#condominium .sec_03 ul li:not(:last-child) {margin-right: 2.4vw;}
	#condominium .sec_03 ul li figcaption {font-size: 2.1vw; position: relative; padding-bottom: 4vw;}
	#condominium .sec_03 ul li figcaption:after  {display: block;border-bottom: solid 2px #68b2c7;border-left: solid 2px #68b2c7; position: absolute; bottom: 0; left: 50%; transform: rotate(-45deg) translate(0,-50%);margin-left: 0; }

}

/* ------------------------------------------------ */
/* sec_tourlist*/
/* ------------------------------------------------ */

#condominium .sec_tourlist  {padding: 0 60px 70px;background: #edfafd;border-radius: 10px;}

#condominium .tour_bord:first-child {padding-top: 50px;}
#condominium .tour_bord:not(:first-child) {padding-top: 90px;}


#condominium .sec_tourlist .tour_head {text-align: center; margin-bottom: 40px; width: 100%;}

#condominium .sec_tourlist .tour_head span {position: relative; line-height: 1.4;}

#condominium .sec_tourlist .tour_head span:before ,
#condominium .sec_tourlist .tour_head span:after {content: ""; display: inline-block;background-size: 100%; position: absolute; top: 50%; transform: translate(0,-50%);}

#condominium #sec_tourlist_01 .tour_head span:before { width: 106px; height: 76px; background: url("../img/sec_tour_01_tit_bg_l.png") no-repeat; left: -126px;}
#condominium #sec_tourlist_01 .tour_head span:after {width: 46px; height: 72px; background: url("../img/sec_tour_01_tit_bg_r.png") no-repeat; right: -66px;}
#condominium #sec_tourlist_02 .tour_head span:before { width: 66px; height: 63px; background: url("../img/sec_tour_02_tit_bg_l.png") no-repeat; left: -100px;}
#condominium #sec_tourlist_02 .tour_head span:after {width: 195px; height: 97px; background: url("../img/sec_tour_02_tit_bg_r.png") no-repeat; right: -220px;}
#condominium #sec_tourlist_03 .tour_head span:before { width: 90px; height: 88px; background: url("../img/sec_tour_03_tit_bg_l.png") no-repeat; left: -116px;}
#condominium #sec_tourlist_03 .tour_head span:after {width: 110px; height: 57px; background: url("../img/sec_tour_03_tit_bg_r.png") no-repeat; right: -150px;}

#condominium .sec_tourlist .tour_box:not(:last-child) {margin-bottom: 20px;}
#condominium .sec_tourlist .tour_box_header {background: #68b2c7; padding: 10px 15px; display: table; vertical-align: middle; width: 100%;}
#condominium .sec_tourlist .tour_box_dep {display: table-cell; vertical-align: middle;background: #fff; color:#68b2c7; font-weight: bold; border-radius: 5px; text-align: center; height: 30px; width: 80px; line-height: 32px; font-size: 18px; padding-top: 3px;}
#condominium .sec_tourlist .tour_box_tit { display: table-cell; width:calc(100% - 90px); vertical-align: middle; padding: 5px 0 0 15px; }
#condominium .sec_tourlist .tour_box_tit_txt {color: #fff; font-size: 20px; font-weight: bold;display: inline; }
#condominium .sec_tourlist .tour_box_tit span {float: right;display: inline;color: #fff; font-size: 20px; font-weight: bold;}


#condominium .sec_tourlist .tour_box .tourlist_btn{display: flex;/* flex-wrap: wrap; */justify-content: center; align-items: center;margin: 0 auto; width: 100%;}
#condominium .sec_tourlist .tour_box .tourlist_btn dt{font-weight: bold; font-size: 1.6rem; flex-grow: 1; }
#condominium .sec_tourlist .tour_box .tourlist_btn dd{padding: 5px 10px;}
#condominium .sec_tourlist .tour_box .tourlist_btn dd a{display: block;background: #f7af0e; font-size: 1.35rem; position: relative; height: 44px; border-radius: 8px; color: #fff; line-height: 44px; text-align: center; font-weight: bold; padding: 0 20px; min-width: 120px;}
#condominium .sec_tourlist .tour_box .tourlist_btn dd a:after {position: absolute;top: 50%;right: 10px;width: 10px;line-height: 10px;content: '';background: url(../img/arr_white.svg) center center / 100% auto no-repeat;aspect-ratio: 8 / 14;width: 6px;transform: translateY(-50%);}

@media screen and (max-width:767px) {
	#condominium .sec_tourlist {width: calc(100% + 30px); margin: 0 0 0 -15px; padding: 0 15px 9.3vw 15px;border-radius: 0;}
	#condominium .tour_bord:first-child {padding-top: 8vw;}
	#condominium .tour_bord:not(:first-child) {padding-top: 9.3vw;}

	#condominium .sec_tourlist .tour_box_dep {font-size: 14px; width: 50px;}

	#condominium .sec_tourlist .tour_head {margin-bottom: 4vw;}
	#condominium .sec_tourlist .tour_head span {position: relative; display: inline-block;}
	#condominium .sec_tourlist .tour_head span br {display: inline-block;}
	#condominium #sec_tourlist_01 .tour_head span:before {width: 14.1vw; height: 10.1vw; background: url("../img/sec_tour_01_tit_bg_l.png") no-repeat; left: -20vw; background-size: 100%;}
	#condominium #sec_tourlist_01 .tour_head span:after {width: 6.1vw; height: 9.6vw; background: url("../img/sec_tour_01_tit_bg_r.png") no-repeat; right: -14.13vw; background-size: 100%;}
	#condominium #sec_tourlist_02 .tour_head span:before {width: 8.8vw; height: 8.4vw; background: url("../img/sec_tour_02_tit_bg_l.png") no-repeat; left: -16.6vw; background-size: 100%;}
	#condominium #sec_tourlist_02 .tour_head span:after {width: 26vw; height: 12.93vw; background: url("../img/sec_tour_02_tit_bg_r.png") no-repeat; right: -29vw; background-size: 100%;}
	#condominium #sec_tourlist_03 .tour_head span:before {width: 12vw; height: 11.73vw; background: url("../img/sec_tour_03_tit_bg_l.png") no-repeat; left: -18.6vw; background-size: 100%;}
	#condominium #sec_tourlist_03 .tour_head span:after {width: 14.6vw; height: 7.6vw; background: url("../img/sec_tour_03_tit_bg_r.png") no-repeat; right: -20vw; background-size: 100%;}
	#condominium .sec_tourlist .tour_box_tit { width:calc(100% - 60px);}
	#condominium .sec_tourlist .tour_box_tit_txt ,
	#condominium .sec_tourlist .tour_box_tit span {font-size: 16px; }

	#condominium .sec_tourlist .tour_box .tourlist_btn{flex-wrap: wrap; }
	#condominium .sec_tourlist .tour_box .tourlist_btn dd{flex: 1 0 50%;}
}


/* ------------------------------------------------ */
/* tourlist*/
/* ------------------------------------------------ */

.tourlist .tour_cnt {margin-bottom: 20px;}
#condominium .sec_tourlist .tour_box:last-child .tourlist .tour_cnt {margin-bottom: 0;}
.tourlist .tour_cnt_wrap{padding: 12px 15px;}
.tourlist .tour_cnt_wrap .tour_info_list .tit ,
.tourlist .tour_cnt_wrap .tour_info_tab_nav li span {background: #68b2c7;}
.tourlist .tour_cnt_wrap .tour_info_tab_nav li span {border-bottom: 3px solid #68b2c7;}

.tourlist .tour_cnt_head_01 {padding: 10px 15px; background: #f4f4f4; display: flex; justify-content: space-between; flex-wrap: wrap;}
.tourlist .tour_cnt_head_01 .tour_pic {width: 355px; display: flex; justify-content: space-between; align-items: baseline;}
#condominium .tourlist .tour_cnt_head_01 .tour_pic img {width: calc((100% - 15px) / 2 ); height: auto;}

.tourlist .tour_cnt_head_01 .cnt_head_note {width: calc(100% - 375px);}
.tourlist .tour_cnt_head_01 .tour_txt {font-size: 15px; color: #222222; font-weight: bold; margin-bottom: 15px;}
.tourlist .tour_cnt_head_01 .tour_facility {display: table; width: 100%;}
.tourlist .tour_cnt_head_01 .tour_facility_tit {display: table-cell; width:70px; background: #68b2c7; color: #fff; text-align: center;}
.tourlist .tour_cnt_head_01 .tour_facility_txt {display: table-cell; width:calc(100% - 70px); background: #fff; color: #222222; font-size: 14px; padding: 5px 10px; }


.tourlist .tour_cnt_wrap .tour_info_list .tit ,
.tourlist .tour_cnt_wrap .tour_info_list p {font-size: 11px;}
.tourlist .tour_cnt_wrap .tour_info_list .txt .direct {color:#68b2c7; border: solid 1px #68b2c7; font-size: 11px; }
.tourlist .tour_cnt_wrap .tour_info_tab_nav li span {font-size: 15px; }
.tourlist .tour_cnt_wrap .tour_info_tab_nav li.active span {color:#68b2c7; }
.tourlist .tour_cnt_wrap .tour_info_tab_panel .panel_cnt:first-child {display: block;}
.tourlist .tour_cnt_wrap .tour_info_tab_panel .tour_btn a {background: #f7af0e; font-size: 14px;}


@media screen and (max-width:767px) {
	.tourlist {margin: 0 auto;}
	.tourlist .tour_cnt {border-top: none;border: 1px solid #c8c8c8; padding-bottom: 0;}
	.tourlist .tour_cnt_head_01 .tour_pic ,
	.tourlist .tour_cnt_head_01 .cnt_head_note {width: 100%;}
	.tourlist .tour_cnt_head_01 .tour_pic {margin-bottom: 10px;}
	.tourlist .tour_cnt_head_01 .tour_txt {line-height: 1.4; margin-bottom: 10px;}
	.tourlist .tour_cnt_head_01 .tour_facility {display: table; width: 100%; border: solid 1px #68b2c7;}
	.tourlist .tour_cnt_head_01 .tour_facility_tit {background: #fff; color: #68b2c7;  padding: 5px; width: 60px;}
	.tourlist .tour_cnt_head_01 .tour_facility_txt {vertical-align: top; text-align: left; line-height: 1.4; padding: 5px;}
	.tourlist .tour_cnt_wrap { padding: 0 0 15px;}
	.tourlist .tour_cnt_wrap .tour_info_tab_nav li.active span {background:#68b2c7; color: #fff; }
	.tourlist .tour_cnt_wrap .tour_info_tab_nav li span {background: #cccccc; border-bottom: none;}
	.tourlist .tour_cnt_wrap .tour_info_tab_panel {border: solid 2px #68b2c7; border-top: solid 4px #68b2c7;}
	.tourlist .tour_cnt_wrap .tour_info_tab_nav li span strong {font-size: 16px;}
	.tourlist .tour_cnt_wrap .tour_info_tab_nav li span {font-size: 14px;}
}


/*@media screen and (max-width:480px) {
	.tourlist .tour_cnt_wrap .tour_info_tab_panel .tour_price_tit span {font-size: 12px;}
}
@media screen and (max-width:320px) {
	.tourlist .tour_cnt_wrap .tour_info_tab_panel .tour_price_tit span {font-size: 10px;}
}*/

/* ------------------------------------------------ */
/* sec_info*/
/* ------------------------------------------------ */
#condominium .sec_info {padding: 85px 60px 80px; display: flex; flex-wrap: wrap; justify-content: space-between;}



#condominium .sec_info .bord {width: 540px;}
#condominium .sec_info figure {width: calc(100% - 580px);}

#condominium .sec_info .sec_tit {font-size: 30px;padding-bottom: 25px;}
#condominium .sec_info .txt_01 {margin-bottom:30px; }


#condominium .sec_info .tel_txt {color: #68b2c7;font-weight: bold;font-size: 60px;line-height: 1;font-family: 'arial', sans-serif; margin-bottom: 15px; margin: 0 auto 15px; text-align: center;}
#condominium .sec_info .tel_txt p:before {display: inline-block;	margin-right: 10px;aspect-ratio: 1 / 1;background: url(../img/icon_tel_blue.svg) center center / auto 100% no-repeat;content: "";width:38px;}
#condominium .sec_info .bl_btn { text-align: center;}
#condominium .sec_info .bl_btn a {background: #f7af0e; color: #fff; border-radius: 8px; width: 425px; height: 50px; display: flex;align-items: center; justify-content: center;  font-size: 18px; font-weight: bold;position: relative; padding-right: 20px; line-height: 1; margin: 0 auto;}

#condominium .sec_info .bl_btn a:after  {position: absolute; right: 15px;top:50%;content:'';background: url(../img/arr_white.svg) center center / 100% auto no-repeat;aspect-ratio: 8 / 14;width:8px;transform: translateY(-50%);}


@media screen and (max-width:1200px) {
	#condominium .sec_info {padding: 85px 15px 80px;}
	#condominium .sec_info figure {width: calc(100% - 560px);}

}


@media screen and (max-width:767px) {
	#condominium .sec_info {padding: 8vw 0 9.3vw;}
	#condominium .sec_info .sec_tit {font-size: 5vw; text-align: center; margin-bottom: 5.3vw;padding-bottom: 0;}
	#condominium .sec_info .bord ,
	#condominium .sec_info figure {width:100%;}
	#condominium .sec_info figure ,
	#condominium .sec_info .txt_01 {margin-bottom: 5.3vw;}
	#condominium .sec_info .tel_txt a {color: #68b2c7;font-weight: bold;font-size:12.1vw;line-height: 1;font-family: 'arial', sans-serif; margin-bottom: 15px; margin: 0 auto 15px; text-align: center;}
	#condominium .sec_info .tel_txt span:before {display: inline-block;	content: "";margin-right: 10px;aspect-ratio: 1 / 1;background: url(../img/icon_tel_blue.svg) center center / auto 100% no-repeat;width:8vw;}
	#condominium .sec_info .bl_btn a {width: 100%;}
}





