@charset "utf-8";
/*----------学生キャンペーン用フォント----------*/
/*@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');*/

html {scroll-behavior: smooth;}

#wrap {
	color: #000;
    padding-bottom: 20px;
}
.main {
    padding-bottom: 0;
}

/*----------▼メインビジュアル----------*/
#header-section {
    width: 100%;
    background: url(../img/hawaii_bg01_mini.jpg) no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
    overflow: hidden;
}
.hawaiitabi_logo {
	width: 992px;
	margin: 0 auto;
	padding-top: 30px;
	text-align: center;
	position: relative;
}
.logo{
	position: absolute;
	top:40px;
	left:50%;
	margin-left: -480px;
}

/*----------▼ハワイ最新情報まとめバナー----------*/
.bnr_top {
	width: 992px;
    margin: 50px auto;
    text-align: center;
    border: 3px solid #fff;
    background: #fff;
    box-sizing: border-box;
    overflow: hidden;    
}
.bnr_top a:hover {
	transition:all 0.4s ease;    
    opacity: .8;
}

/*----------▼ツアー販売期間----------*/
#wrap {
    line-height: inherit;
}
.announce {
    width: 460px;
    text-align: center;
    color: #fff;
    font-size: 32px;
    font-weight: bold;  
    padding: 15px 0 10px;
    margin: 15px auto 80px;
    background: #ed3a60;
    border: 4px solid #fff;
    border-radius: 80px;
    line-height: 1;
}
.announce p { font-weight: bold;}
.announce p:first-child {
    font-size: 23px;
    margin-bottom: 10px;
}

/*----------▼最新のお知らせ----------*/
#newsWrap {
    width: 992px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 3px 7px 0 rgb(10 39 93 / 70%);
    border: 3px solid #fff; 
}
#newsWrap h2 {
    font-size: 20px;
    color: #fff;
    text-align: center;
    font-weight: bold;
    padding: 10px 0 5px;
    background-color: #0450b9;
    
}
#newsBox .newslist {
    padding: 10px 42px 15px;
    max-height: 160px;
    overflow-y: auto;
}
#newsBox .newslist li {
	display: flex;
    justify-content: space-between;
	border-top: dotted 1px #ccc;
	padding: 12px 0;
}
#newsBox .newslist li:first-child {
	border-top: none;
}
#newsBox .newslist li:empty {
	display: none;
}
#newsBox .newslist .date {
    width: 170px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
#newsBox .newslist .date time {
	font-size: 13px;
}
#newsBox .newslist .date p {
	width: 84px;
	font-size: 11px;
	text-align: center;
	color: #fff;
}
#newsBox .newslist .text {
    width: 700px;
	font-size: 14px;
	line-height: 1.5em;
}
#newsBox .newslist .text a {
	color: #333;
    text-decoration: none;
}
#newsBox .newslist .text a:hover {
    text-decoration: underline;
}
#newsBox .newslist .price {
	color: red;
}
#newsBox .newslist .red {
	color: red;
}

/*----------▼各種リンク----------*/
#link-wrap {
    width: 992px;
    margin: 20px auto 100px;
}
#link-wrap ul {
    display: flex;
    justify-content: space-between;
}
#link-wrap .link-box {
    position: relative;
    width: 32.4%;
    display: flex;
    align-items: center;    
    background: #fff;
    padding: 7px;
    border: solid 5px #fff;
}
#link-wrap .link-box a {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: 1;
}
#link-wrap .link-box:hover{
	transition:all 0.4s ease;
    filter: brightness(110%);
}
#link-wrap .link-box:after {
    background: url("../img/link_btn.png");
    content: "";
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 25px;
    height: 25px;
    background-size: cover;
}
#link-wrap .link-box .photo {
    width: 90px;
    margin-right: 12px;
}
#link-wrap .link-box .photo img {
    width: 100%;
}
#link-wrap .link-box .text {
    width: 65%;
}
#link-wrap .card01 {background: #ffc62e;}
#link-wrap .card02 {background: #bcd30d;}
#link-wrap .card03 {background: #f9bcdc;}
#link-wrap .card01 img {filter: drop-shadow(4px 4px 0px #e67b13);}
#link-wrap .card02 img {filter: drop-shadow(4px 4px 0px #789e12);}
#link-wrap .card03 img {filter: drop-shadow(4px 4px 0px #e165a6);}

#link-wrap .link-box p {
    font-family: "Noto Sans JP", "Yu Gothic", "YuGothic", sans-serif;
    font-weight: bold;
}
.link-box .catch span {
    background: #fff;
    padding: 2px 3px;
    display: inline-block;
    font-size: 13px;
    line-height: 1.2em;
}
.link-box .ttl {
    font-size: 25px;    
    line-height: 1.1em;
    margin-top: 5px;
}

/*----------▼おすすめツアー----------*/
#tourWrap {
    width: 992px;
    margin: 80px auto 100px;
}
#tourWrap h2,
#airhotelWrap h2,
#airWrap h2,
#specialWrap h2{
	font-size: 32px;
    line-height: 1.0em;
	font-weight: bold;
	text-align: center;
}
#tourWrap h2:before,
#airhotelWrap h2:before,
#airWrap h2:before,
#specialWrap h2:before {
	content: "";
	display: inline-block;
	width: 100px;
	height: 2px;
	background-color: #000;
	vertical-align: middle;
	margin-right: 15px;
}
#tourWrap h2:after,
#airhotelWrap h2:after,
#airWrap h2:after,
#specialWrap h2:after {
	content: "";
	display: inline-block;
	width: 100px;
	height: 2px;
	background-color: #000;
	vertical-align: middle;
	margin-left: 15px;
}
#wrap h2 + .alpha {
	font-family: Verdana, Geneva, "sans-serif";
	text-align: center;
	letter-spacing: 0.03em;
	font-size: 15px;
	color: #aaa;
	margin-bottom: 60px;
}

/*タブ実装*/
.tab_box .btn_area {
	display: flex;
}

.tab_box .tab_btn {
    position: relative;    
    text-align: center;
    height: auto;
    width: 33.3%;
    border: 2px solid #000;
}
.tab_box .tab_btn:hover {
    cursor: pointer;
}
.tab_box .tab_btn + .tab_btn {
	margin-left: 8px;
}

.tab_box .tab_btn.active {
    background-color: #efdc05;
    position: relative;
    font-weight: bold;
}
.tab_btn .btn-text {
    height: 66px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    font-weight: bold;
	color: #000;
}
.tab_box .tab_btn.active::before, .tab_box .tab_btn.active::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;   
}
.tab_box .tab_btn.active::before {
    border-color: #000 transparent transparent transparent;
    border-width: 13px 13px 0 13px;
    bottom: -13px; 
}
.tab_box .tab_btn::after {
    content: "";
    border-color: #efdc05 transparent transparent transparent;
    border-width: 11px 11px 0 11px;
    bottom: -10.75px;    
}
.tab_box .tab_panel {
    display:none;
}
.tab_box .tab_panel.active {
    display:block;
}
.panel_area .catch {
    height: 80px;
    margin: 30px 0 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.panel_area .panel-inner {
    padding-top: 160px;
    margin-top:-160px;
}
.panel_area .panel-inner h4 {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    line-height: 1;
}
.panel_area .panel-inner .sub_ttl {
    text-align: center;
    font-size: 16px;
    margin-top: 15px;
    line-height: 1;
}


/*----------▼HISの新しいサービス----------*/
#new-service {
    /*background: #f7f4ea;*/
    padding: 60px 0 100px;
    position: relative;
    background-color: #fff5d8;
    background-image: radial-gradient(#ffffff 26%, transparent 29%),radial-gradient(#ffffff 26%, transparent 29%);
    background-position: 0 0, 7px 7px;
    background-size    : 14px 14px;    
}

#new-service::after {
    content: "" !important;
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: #8b585800 transparent transparent transparent;
    position: absolute;
    z-index: 10;
    border-top-color: #fff !important;
    border-width: 40px 70px 0 70px;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}
#new-service .inner {
    width: 992px;
    margin: 0 auto;
}
#new-service h2 {
    width: 520px;
    margin: 0 auto 50px;
}
#new-service h2 img {
    width: 100%;
}
.service-wrap {
    display: flex;
    justify-content: space-between;
}
.service-box {
    padding: 25px;
    border-radius: 10px;
    background: #fff;
    border: 2px solid #000;
}
.service-box .ttl {
    font-size: 20px;
    font-weight: bold;
    margin: 15px 0;
    padding: 5px 0 5px 12px;
    border-left: 6px solid #efdc05;
    color: #083d8c;
}
.service-box .catch {
    font-weight: bold;
    color: #083d8c;
    font-size: 15px;
}
.service02 img {
    border: 1px solid #bdbdbd;
}
/*2col*/
.col2 .service-box {
    width: 49%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 25px 15px 25px 25px;
}
.col2 .service-box img {
    width: 32%;
    height: 115px;
    object-fit: cover;
}
.col2 .service-box div {
    width: 64%;
}
.col2 .service-box .ttl {
    margin: 0 0 8px 0;
}
/*col3*/
.col3 .service-box {
    width: 32.4%;
}
.col3 .service-box img {
    width: 100%;
}
/*---------------------------------------------
おすすめツアー（商品設定）
---------------------------------------------*/
.tour-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	/*justify-content: center;*/
	margin-bottom: 30px;
}
.tour-box > li {
	background-color: #fff;
	border: solid 2px #ececec;
	position: relative;
}
.tour-box.col4 > li {width: 24%; margin: 0 0.5% 20px;}
.tour-box.col3 > li {width: 31%; margin: 0 1% 20px;}
.tour-box.col2 > li {width: 48%; margin: 0 1% 20px;}

.tour-box > li:hover {
	border: solid 2px #fbd438;
	transition: all 0.6s ease;
}
.tour-box > li a {
	display: block;
	width: 100%;
	height: 100%;
	color: #333;
	text-decoration: none;
	padding-bottom: 20px;
}
.item_icon {
    position: absolute;
    left: 0;
    top: 1px;
    color: #fff;
    z-index: 1;
}
.item_icon .item_icon01 {
    background-color: #875c0b;
    padding: 3px;
	font-size: 12px;
}
.item_icon .item_icon01:empty{
	display: none;
}

.tour-box .tour-img img {
	width: 100%;
    image-rendering: -webkit-optimize-contrast;
    height: 155px;
    object-fit: cover;    
}
.tour-box .icon-area {
	padding: 5px 10px;
}
.tour-box .icon-area ul {
	display: flex;
	flex-wrap: wrap;
}
.tour-box .icon-area ul li{
	display: inline-block;
    padding: 1px 2px;
	margin: 0 3px 3px 0;
    color: #fff;
	font-size: 11px;
}

li.icon-myeong{background-color: #7532e0;}
li.icon-dlx{background-color: #e04b32;}
li.icon-ss{background-color: #4bc9cc;}
li.icon-meal{background-color: #f79739;}
li.icon-tokuten{background-color: #d15796;}
li.icon-free{background-color: #6dac4f;}

.tour-box .tour-title {
	font-size: 15px;
	line-height: 1.4em;
	font-weight: bold;
	color: #235BC0;
	padding: 0 10px;
	margin-bottom: 10px;
}
.tour-box .tour-text {
	font-size: 12px;
	line-height: 1.4em;
	padding: 0 10px;
	margin-bottom: 10px;
}
.tour-box .info-area {
	margin-bottom: 20px;
}
.tour-box .info-area ul {
	background-color: #f2f2f2;
	padding: 5px 10px;
	font-weight: bold;
	font-size: 11px;
	line-height: 1.3em;
}
.tour-box .info-area ul li {
	margin-bottom: 3px;
	padding-left: 20px;
}
.tour-box .info-area ul li:last-child {
	margin-bottom: 0;
}
.tour-box .info-area .hotel{
	background: url(/kaigai/kansai/common/img/icon/icon_hotel01.png) no-repeat left top;
    background-size: 14px;
}
.tour-box .info-area .lank{
	background: url(/kaigai/kansai/common/img/icon/icon_recom03.png) no-repeat left top;
    background-size: 14px;
}
.tour-box .info-area .airline{
	background: url(/kaigai/kansai/common/img/icon/icon_air04.png) no-repeat left top;
    background-size: 14px;
}
.tour-box .info-area .time{
	background: url(/kaigai/kansai/common/img/icon/icon_time01.png) no-repeat left top;
    background-size: 14px;
}
.tour-box .item-ship{
	background: url(/kaigai/kansai/common/img/icon/cruse.png) no-repeat left top;
    background-size: 14px;
}
.tour-box .tour-price{
    padding: 0 10px;
    font-size: 16px;
	line-height: 1.3em;
    font-weight: bold;
    text-align: right;
    color: #ef1d1d;
}
.tour-box .tour-nenyu{
	padding: 0 10px;
	font-size: 11px;
    color: #ef1d1d;
	text-align: right;
}
.tour-box .tour-dep{
	padding: 0 10px;
	text-align: right;
	font-size: 11px;
}
.tour-box .icon-area li:empty{
	display: none;
}
.tour-box .info-area li:empty{
	display: none;
}
.tour-box > li:after {
    content: "";
    bottom: 0;
    right: 0;
    border-top: 0.7em solid transparent;
    border-right: 0.7em solid #fbd438;
    position: absolute;
}

/*2カラムの時*/
.tour-box.col2 .tour-img {
	width: 210px;
	position: absolute;
	top:0;
	left: 0;
}
.tour-box.col2 .info-area {
	width: 210px;
	position: absolute;
	top: 139px;
	left: 0;
}
.tour-box.col2 > li {
	min-height: 200px;
}
.tour-box.col2 > li a {
	padding-left: 215px;
}

/*商品空の時*/
.tour-box > li:empty {
    display: none;
}

/*----------▼おすすめ特集----------*/
#specialWrap {
	width: 100%;
	padding: 50px 0;
	background-color: #f7f5f0;
}
#specialWrap .inner {
	width: 992px;
	margin: 0 auto;
}
#specialWrap ul {
	display: flex;
	justify-content: space-between;
}
#specialWrap ul.col4 li {width: 23%;}
#specialWrap ul.col3 li {width: 31%;}
#specialWrap ul.col2 li {width: 48%;}
#specialWrap ul li a {
	display: block;
}
#specialWrap ul li a:hover {
	opacity: 0.8;
	transition: all 0.6s ease;
}
#specialWrap ul li img {
	width: 100%;
}


/*----------▼航空券+ホテル、航空券----------*/

#airahWrap {
    width: 992px;
    margin: 0 auto 50px;
    display: flex;
	flex-wrap: wrap;
    justify-content: space-between;
	padding-top: 100px;
}
/*
#airhotelWrap, #airWrap {
    width: 49%;
    display: flex;
    flex-direction: column;
}
.airah-list {
    height: 100%;
}
.airah-box {
    display: flex;
    justify-content: space-between;
}
.airah-box .tour-img img {
    width: 100%;
    height: 155px;
    object-fit: cover;
}
#airahWrap .ah-box > li, #airahWrap .air-box > li {
    width: 49%;
    background-color: #fff;
    border: solid 2px #ececec;    
}
#airahWrap .ah-box li:hover, #airahWrap .air-box li:hover {
	border: solid 2px #fbd438;
	transition: all 0.6s ease;
}
#airahWrap .ah-box a, #airahWrap .air-box a {
    height: 100%;
    display: block;
    color: inherit;
    text-decoration: none;
    border-radius: 0;
    box-shadow: none;
}
#airahWrap .tour_ttl {
    font-size: 16px;
    margin: 10px 0 8px;
    font-weight: bold;
    line-height: 1.3em;
}
#airahWrap .tour_ttl > span {
    display: block;
}
#airahWrap .tour_detail {
    padding: 0 10px;
}

#airahWrap .tour_topwrap, #airahWrap .tour_fuel, #airahWrap .tour_detail {
    padding: 0 10px;
    display: block;    
}

#airahWrap .tour_point {
    display: block;
    font-size: 12px;
}

#airahWrap .airah-box .tour-price {
    display: block;
    padding: 0 10px;
    font-size: 16px;
    line-height: 1.3em;
    font-weight: bold;
    text-align: right;
    color: #ef1d1d;
    padding-top: 20px;
}
#airahWrap .product__list--title {
    font-size: 16px;
    margin: 8px 0;
}
#airahWrap .product__list--more {
    display: flex;
    align-items: baseline;
    margin-top: 1px;
}
#airahWrap .product__list--more--title {
    display: inline-block;
    line-height: 1.2;
    background: #7d7d7d;
    color: #fff;
    text-align: center;
    padding: 2px 2px;
    width: 72px;
    margin-right: 5px;    
}
.product__list--more--text {
    width: calc(100% - 72px - 5px);
}
#airahWrap .tour_ttl{
    display: block;
    font-size: 15px;
    margin: 8px 0;
    color: #235BC0;    
}
#airahWrap .tour_fuel {
    font-size: 11px;
    color: #ef1d1d;
    text-align: right;
    margin-bottom: 10px;
}
#airahWrap .bnr {
    margin: 30px auto 50px;
}
*/
/*-----------------------------------------
航空券+ホテル
-----------------------------------------*/
#airhotelWrap {
	width: 100%;
	padding: 50px 0;
}
#airhotelWrap .inner {
	width: 992px;
	margin: 0 auto;
}

/*---------------------------------------------
航空券+ホテル（商品設定）
---------------------------------------------*/
.airhotel-box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 30px;
}

/*-----------------------------------------
航空券
-----------------------------------------*/
#airWrap {
	width: 100%;
	padding: 50px 0;
}
#airWrap .inner {
	width: 992px;
	margin: 0 auto;
}
#airWrap .inner > h3 {
	font-size: 18px;
	padding: 5px 15px;
	margin-bottom: 20px;
	border-left: solid 5px #875c0b;
    font-weight: bold;
}
.air-box {
	width: 100%;
	display: flex;
    flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 30px;
}
/*---------------------------------------------
   FIT新スタイル
---------------------------------------------*/
#airhotelWrap,#airWrap{
	
	.product__list {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		flex-grow: 1;
		gap: 15px 1%;
	}
	.product__list--data-code {
	  display: none;
	}
	.product__list--inner > *:not(.product__list--image):not(.product__list--label) {
		margin: 0px!important;
	}
	.product__list--data {
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	}
	.product__list--item {
	  letter-spacing: .5px;
	  list-style: none;
	}
	img.product__list--image {
	  width: 100%;
	  object-fit: cover;
		height: 160px;
		margin: 0;
	}
	.product__list--label {
	  display: none;
	}
	.product__list--type {
	  display: none;
	}
	.product__list--text-wrapper {
	  flex-grow: 1;
	  display: flex;
	  flex-direction: column;
	  line-height: 1.2;
		margin: 0;
	}
	.product__list--texts {
	  display: flex;
	  flex-direction: column;
		padding: 0 10px;
	}
	.product__list--title {
	  /*font-size: 14px;*/
	  font-size: 15px;
		margin: 8px 0;
		font-weight: bold;
	}
	.product__list--title > [class*="product__list--"] {
	  display: block;
	}
	.product__list--title .product__list--country + .product__list--area {
	  background: none;
	  padding: 0;
	  color: #333;
	}
	.product__list--more {
	  margin-top: 10px;
		display: flex;
		align-items: baseline;
        font-size: 12px;/*追加*/
	}
	.product__list--more + .product__list--more {
	  margin-top: 1px;
	}
	.product__list--more--title {
	  display: inline-block;
	  line-height: 1.2;
	  background: #7d7d7d;
	  color: #fff;
	  text-align: center;
	}
	.product__list--more--title {
	  padding: 2px 0 4px;
	  /*width: 72px;*/
	  width: 65px;
	  margin-right: 5px;
	}
	.product__list--more--text {
	  line-height: 1.3;
	}
	.product__list--more--text {
	  /*width: calc(100% - 72px - 5px);*/
	  width: calc(100% - 65px - 5px);
	}
	.product__list--tokuten {
	  /*margin: 15px 10px 0;*/
	  font-size: 11px;
	  border-top-width: 1px;
		border-top: none;
	    margin: 10px 0 0;
		color: #666;
		padding: .6em 0 0 !important;
	}
	.product__list--tokuten--item:empty,.product__list--tokuten--item:empty {
    	display: none;
	}
	.product__list--tokuten--item {
		border-top: 1px dashed;
		padding-top: 5px;
	}
	.product__list--tokuten--item {
	  text-indent: -1.25em;
	  padding-left: 1.25em;
	}
	.product__list--tokuten--item:not(:first-child) {
	  margin-top: .3em;
	}
	.product__list--price {
	  padding: 20px 4px 10px;
	  margin-top: auto;
		color: #ef1d1d;/*追加*/
	}
	.product__list--price > :not(.product__list--point) {
	  padding-left: 4px;
	  padding-right: 4px;
	}
	.product__list--point {
	  background: var(--default-color-red);
	  color: #fff;
	  text-align: center;
	  font-weight: normal;
	}
	.product__list--point {
	  font-size: 11px;
	  padding: 2px 0 3px;
	  margin-bottom: 4px;
	  letter-spacing: 0;
		display: none;
	}
	.product__list--minmax {
	  color: #ef1d1d;
	  font-weight: bold;
	}
	.product__list--minmax {
	  /*font-size: 18px; *//*18*/
	  font-size: 16px; /*16*/
	}
	.product__list--minmax :where(.is-en, .is-kara) {
	  /*font-size: .7em;*/
	}
	.product__list--notes {
	  /*color: #333;*/
	}
	.product__list--notes {
	  /*font-size: 12px;*/
	  font-size: 11px;
	  margin-top: 5px;
	}
	
}
/*2カラム*/
.product__wrapper:has(.is-half) {
	width: 992px;
	margin: 0 auto;
  display: flex;
  justify-content: space-between;
  /*flex-wrap: wrap;*/
}
.product__wrapper #airhotelWrap.is-half,
.product__wrapper #airWrap.is-half,
.product__wrapper #airhotelWrap.is-half .inner,
.product__wrapper #airWrap.is-half .inner {
  width: 490px;
}
.product__wrapper #airhotelWrap.is-half .product__list,
.product__wrapper #airWrap.is-half .product__list {
	grid-template-columns: repeat(2, 1fr);
	gap: 15px 2%;
}



/*----------▼もっと見るボタンー----------*/
#tourWrap .btn-more,
#airhotelWrap .btn-more,
#airWrap .btn-more,
#specialWrap .btn-more,
#campaign .btn-more {
	width: 450px;
	height: 50px;
	margin: 50px auto 40px;
	font-size: 18px;
	line-height: 50px;
	text-align: center;
	border-radius: 25px;
}
#tourWrap .btn-more {
    margin-top: 30px;
}
#tourWrap .btn-more a,
#airhotelWrap .btn-more a,
#airWrap .btn-more a,
#specialWrap .btn-more a,
#campaign .btn-more a{
	color: #fff;
	display: block;
	text-decoration: none;
	border-radius: 25px;
    background: #0450b9;
}
#tourWrap .btn-more a:after,
#airhotelWrap .btn-more a:after,
#airWrap .btn-more a:after,
#specialWrap .btn-more a:after,
#campaign .btn-more a:after{
    content: "\f105";
    font-family: FontAwesome;
    padding-left: 10px;
}
#tourWrap .btn-more a:hover,
#airhotelWrap .btn-more a:hover,
#airWrap .btn-more a:hover,
#specialWrap .btn-more a:hover,
#campaign .btn-more a:hover{
	opacity: 0.8;
	transition: all 0.6s ease;
}


/*----------▼バナー----------*/
.bnr {
    width: 960px;
    margin: 0 auto 50px;
}
.bnr a:hover {
	opacity: 0.8;
	transition: all 0.6s ease;
}

/*----------▼サイドナビー----------*/
#sideNavi {
	height: auto;
	position: fixed;
	top: 40%;
	right: 20px;
	z-index: 5;
	display: none;
}
#sideNavi ul {
	height: auto;
	display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
	text-align: right;
}
#sideNavi ul li {
	font-size: 13px;
	margin-bottom: 10px;
}
#sideNavi ul li a {
	display: block;
	color: #333;
	text-decoration: none;
	font-weight: bold;
}
#sideNavi ul li a.current {
	color: #0450b9;
	display: block;
}
#sideNavi ul li a:after {
	content: "●";
	width: 13px;
	height: 13px;
	margin-left: 3px;
}


/*----------行こーよハワイキャンペーン----------*/
#campaign {
    width: 100%;
    background-image: url("../img/campaign/bg.png");
    color: #222;
    padding: 60px 0;
	.inner {
		width: 992px;
		margin: 0 auto;
	}
	h2 {
		text-align: center;
		margin-bottom: 15px;
	}
	.cpn-box {
		width: 100%;
		background: url("../img/campaign/bg-wave.png") no-repeat top center;
		padding: 50px 30px 30px;
		position: relative;
		h3 {
			text-align: center;
			margin-bottom: 25px;
		}
		.dinner-box {
			display: flex;
			flex-wrap: wrap;
			background-color: #fff;
			border-radius: 16px;
			padding-bottom: 20px;
			position: relative;
			.title {
				width: 100%;
				background-color: #f0811b;
				color: #fff;
				font-size: 24px;
				font-weight: bold;
				text-align: center;
				border-top-left-radius: 16px;
				border-top-right-radius: 16px;
				padding: 8px 0 6px;
				margin-bottom: 30px;
				span {
					font-size: 15px;
					background-color: #fff835;
					color: #00acb7;
					display: inline-block;
					padding: 2px 10px 0;
					transform: translateY(-2px);
				}
			}
			.text {
				width: 45%;
				padding: 0 20px 0 40px;
				font-size: 18px;
				font-weight: bold;
				line-height: 1.7;
				mark {
					background:linear-gradient(transparent 60%, #ff6 60%);
				}
			}
			.ph {
				width: 55%;
				display: flex;
				align-items: flex-end;
				img {
					width: 100%;
				}
				li:nth-child(1) {
					width: 240px;
					margin-right: 10px;
				}
				li:nth-child(2) {
					width: 180px;
				}
			}
			.fukidashi {
				position: absolute;
				right: -15px;
				top: 37px;
			}
		}
		.illust1 {
			position: absolute;
			left: -37px;
			top: 12px;
		}
		.illust2 {
			position: absolute;
			right: 20px;
			top: -80px;
		}
	}
	.detail-box {
		width: 100%;
		background-color: #fff;
		padding: 30px;
	}
	.detail {
		font-size: 16px;
		line-height: 1.7;
		margin-bottom: 20px;
		li {
			span:first-child {
				font-weight: bold;
			}
		}
	}
	.notice-midashi{
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 24px;
		text-align: center;
	}
	.notice {
		font-size: 13px;
		line-height: 1.5;
		margin-bottom: 20px;
		li {
			position: relative;
			padding-left: 15px;
			&::before {
				position: absolute;
				left: 0;
				content: "※";
			}
		}
	}
	.btn-more a {
		background-color: #00acb7;
	}
	/*アコーディオン*/
	.accordion-item{
	  display: none
	}
	.accordion-button {
		width: 200px;
		margin: auto;
		border: solid 1px #000;;
		background: #FFF;
		color: #000;
		text-align: center;
		font-size: 15px;
		line-height: 2.0;
		border-radius: 30px;
		cursor: pointer;
	}
	.accordion-button>span{
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  gap: 4px
	}
	.accordion-button>span::before {
	  content: "";
	  background: no-repeat center center / contain;
	  background-image: url(/cmn/icon/icon_arrow_down.svg);
	  width: 20px;
	  height: 20px;
	  display: block
	}
	.accordion-button.is-open>span::before {
	  background-image: url(/cmn/icon/icon_close.svg);
	}
}