@charset "utf-8";
html {
    font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-size: 14px;
    color: #333;
}
header#simple-header_pc {
	display: none;
}
.nopc {
    display: none;
}
/*	セクション
============================== */
.section{
	width: 100%;
	position: relative;
	font-family:Meiryo, Verdana, "Hiragino Kaku Gothic ProN", sans-serif;
}
.section-ttl{
    width: auto;
    display: inline-block;
	margin: 0 auto;
	padding: 20px 30px;
	font-size: 35px;
    font-weight: bold;
	line-height: 1.4em;
    letter-spacing: 0.12em;
    color: #0057b8;
    border-top: solid 3px #0057b8;
    border-bottom: solid 3px #0057b8;
}
.section-txt{
	width: 992px;
	margin: 15px auto 0;
	padding: 20px;
	line-height: 1.6em;
	color: #444;
	font-size: 18px;
	border-top: 1px dotted #ddd;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}


/*	ヘッダー
============================== */
/*.main-ttl-bg {
    background-color: #d0f0ce;
}*/
/*.main-bg01{
	width: 100%;
	height: 990px;
	padding: 0;
	margin: 0;
	background: url(../img/main_bg.jpg) no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}*/
.main-bg02{
	width: 100%;
	background: url(../../../kansai/img/special/body_bg.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

/*.main-bg03{
	background: url(../../../kansai/img/bg/polaroid.png) repeat;
}
*/

#islnad-icon{
	position: fixed;
	left:0;
	top: 50%;
	margin-top: -200px;
	z-index: 100;
}
#islnad-icon li{
	margin: 5px 0;
}

/*	グローバルナビ
============================== */
#gnavi04{
	border-bottom: 2px solid #004BB0;
}

/*	ボックス設定
========================= */

.box{
	width: 990px;
	min-height:400px;
	margin: 0 auto;
	padding: 30px 0;
	position: relative;
}
/*	セクション01
========================= */
#section01{
	position: relative;
    margin: 70px auto 50px;
    text-align: center;
}
.main-box{
	min-width: 1000px;
	max-width: 1200px;
	/*max-height: 600px;*/
	margin: 10px auto 10px;
}
.main-box img{
	width: 100%;
}

.main-box .owl-stage-outer {
  position: relative;
  overflow: visible;
  height: 670px;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}

.main-box .owl-prev{
	width: 800px;
	height: 630px;
	position: absolute;
	top:20px;
	left: -700px;
	background: url(/kix/hawaii/img/slider/controls_prev.png) right 140px center no-repeat;
	text-indent: -9999px;
	z-index: 9999;
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
.main-box .owl-prev:hover{
	transition:all 0.3s ease;
	filter:alpha(opacity=100); 
	opacity:1;
}
.main-box .owl-next{
	width: 800px;
	height: 630px;
	position: absolute;
	top:20px;
	right: -700px;
	background: url(/kix/hawaii/img/slider/controls_next.png) left 140px center no-repeat;
	text-indent: -9999px;
	z-index: 9999;
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
.main-box .owl-next:hover{
	transition:all 0.3s ease;
	filter:alpha(opacity=100); 
	opacity:1;
}

.owl-theme .owl-dots{
	width: 140px;
	margin:0 auto;
}
.owl-theme .owl-dots .owl-dot{
	width:20px;
	display:inline-block;
	zoom:1;*display:inline;
}
.owl-theme .owl-dots .owl-dot span{
	width:10px;
	height:10px;
	margin:5px 2px;
	background:#d6d6d6;
	display:block;
	-webkit-backface-visibility:visible;
	-webkit-transition:opacity 200ms ease;
	-moz-transition:opacity 200ms ease;
	-ms-transition:opacity 200ms ease;
	-o-transition:opacity 200ms ease;
	transition:opacity 200ms ease;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
	border-radius:30px
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span{background:#004098;
	width:15px;
	height:15px;
	margin:3px 0px;
}



.main-slide{
	position: relative;
	padding: 20px 10px;
	color: #FFF;
}
.main-slide-ttl{
	width: 460px;
	font-size: 24px;
	line-height: 1.2em;
	color: #004BB0;
	position: absolute;
	top: 620px;
	left: 10px;
}
.main-slide-txt{
	width: 480px;
	font-size: 13px;
	color: #666;
	position: absolute;
	top: 620px;
	right: 25px;
}
.main-slide-btn{
	display: inline-block;
	font-size: 20px;
	padding: 10px 20px;
	color: #333;
	background-color: #FFF;
	position: absolute;
	bottom: 40px;
	right: 35px;
}


.main-box .owl-item{
	transition:all 0.8s ease;
	filter:alpha(opacity=10); 
	opacity:0.1;
	text-indent: -9999px;
	color: #FFF;
}
.main-box .cloned{
	transition:all 0.8s ease;
	filter:alpha(opacity=10); 
	opacity:0.1;
	text-indent: -9999px;
	color: #FFF;
}
.main-box .active{
	transition:all 0.01s ease;
	filter:alpha(opacity=100); 
	opacity:1;
	text-indent: 0;
}
.main-slide img{
	box-shadow: 0px 1px 6px #bbb;
	-moz-box-shadow: 0px 1px 6px #bbb;
	-webkit-box-shadow: 0px 1px 6px #bbb;
}

/*	セクション02
========================= */
#section02{
	position: relative;
	padding: 0 0 120px;
}

.special-box{
	max-width: 992px;
	margin: 0 auto;
    display: flex;
    justify-content: center;
}

.special-box-mini{
	width: 23%;
	float: left;
	margin: 0.5%;
	padding: 0.5%;
	background-color: #FFF;
	position: relative;
	transition:all 0.2s ease;
}
#wrap .special-box-mini a{
	text-decoration: none;
}
.special-box-mini:hover{
	background-color: #FFFAE8;
	text-decoration: none;
	display: block;
	transition:all 0.4s ease;
	-webkit-transform: scale(1.02);
	-ms-transform: scale(1.02);
	transform: scale(1.02);
}

.special-box-pic{
	/*width: 280px;
	height: 260px;*/
	overflow: hidden;
	background-color: #FFF;
	box-shadow: 0px 1px 1px #ccc;
	-moz-box-shadow: 0px 1px 1px #ccc;
	-webkit-box-shadow: 0px 1px 1px #ccc;
}
.special-box-pic img{
	width: 100%;
	/*height: 100%;*/
}
.special-box-ttl{
	/*width: 260px;*/
	padding: 20px 0 5px;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3em;
	color: #004BB0;
}
.special-box-txt{
	/*width: 260px;*/
	padding: 5px 0 10px;
	font-size: 12px;
	line-height: 1.4em;
	color: #666;
}
.special-box-cate{
	display: inline-block;
	padding: 2px 5px;
	background-color: #d8ebf3;
	font-size: 10px;
	line-height: 1.4em;
	color: #333;
}

/*----------▼もっと見るボタンー----------*/
.btn-more {
	width: 450px;
	height: 50px;
	margin: 50px auto 40px;
	background-color: #cccccc;
	font-size: 18px;
	line-height: 50px;
	text-align: center;
	border-radius: 25px;
    background: #0057b8;
    margin-top: 50px;
}
#wrap .btn-more a {
	color: #fff;
	display: block;
	text-decoration: none;
	border-radius: 25px;
}
.btn-more a:hover{
	background-color: #0566ED;
	transition: all 0.6s ease;
}



/*	ボックス設定
========================= */


/*	カラー設定
========================= */

.island-bg01{
	background-color: #E17457;
}
.island-bg02{
	background-color: #98C473;
}
.island-bg03{
	background-color: #EEBA4E;
}
.island-bg04{
	background-color: #6CA6D4;
}
.island-bg05{
	background-color: #C394C1;
}
.island-c01{
	color: #E17457;
}
.island-c02{
	color: #98C473;
}
.island-c03{
	color: #EEBA4E;
}
.island-c04{
	color: #6CA6D4;
}
.island-c05{
	color: #C394C1;
}
.island-bd01{
	border-color: #E17457;
}
.island-bd02{
	border-color: #98C473;
}
.island-bd03{
	border-color: #EEBA4E;
}
.island-bd04{
	border-color: #6CA6D4;
}
.island-bd05{
	border-color: #C394C1;
}

/*-------------------------------------------------
	スマホ用
-------------------------------------------------*/
@media screen and (max-width: 896px) {
	.nosp{
		display: none;
	}
    .nopc {
        display: block;
    }
    #wrap img {
        width: 100%;
    }
    #section01 {
        margin: 30px 0;
    }
    .section-ttl {
        width: 85%;
        margin: 0 auto;
        padding: 10px 0;
        font-size: 22px;
        line-height: 1.4em;
        letter-spacing: 0.1em;
        border-top: solid 2px #0057b8;
        border-bottom: solid 2px #0057b8;
    }
    .special-box {
        width: 95%;
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .special-box-mini {
        width: 47%;
        float: none;
        margin: 1% 1% 20px 1%;
    }
    .special-box-ttl {
        padding: 10px 0 5px;
    }
    .special-box-txt {
        padding: 0 0 3px;
    }
    #section02 {
        padding: 10px 0 0;
    }
    .hawaii-copyright {
        width: 100%;
        font-size: 12px;
        position: relative;
        text-align: right;
        color: #333;
        padding: 10px 5px 5px;
        bottom: 0;
        right: 0;
        margin-right: 0;
        box-sizing: border-box;
    }
    /*もっと見るボタン*/
    .btn-more {
        background-color: #0057b8;
        width: 80vw;
        height: 40px;
        margin: 5vw auto;
        font-size: 14px;
        line-height: 40px;
        text-align: center;
        border-radius: 20px;
    }
    #wrap .btn-more a{
        color: #fff;
        display: block;
        text-decoration: none;
        border-radius: 20px;
    }
}
/*iPhone XS Max/XR以下・横向き用
-------------------------------------------------*/
@media screen and (max-width: 896px) and (orientation: landscape) {
	.special-box-mini {
        width: 30%;
    }
}
/*iPhoiPhone 8/7/6s/6 Plus以下・横向き用
-------------------------------------------------*/
@media screen and (max-width: 736px) and (orientation: landscape) {
	.special-box-mini {
        width: 30%;
    }
}
/*iPhone 5s/5/SE以下・横向き用
-------------------------------------------------*/
@media screen and (max-width: 568px) and (orientation: landscape) {
	.special-box-mini {
        width: 30%;
    }
}

.nav-search {
    display: none;
}
#pageNavi .navi-list > li:nth-child(3) {
    border-right: none;
}