@charset "utf-8";
/*////////////// hawaii/IslandsCSS Document //////////////*/

/* ===============================================
 all（全体）　
=============================================== */
#mainArea {
    padding: 0 0 5%;
}


/* descText（テキスト）------------------*/
.descText {
    padding: 1rem 6.2% 0;
}


/* bg01（背景01）------------------*/
.bg01 {
    background-image: url("/cmn/img/kanto/hawaii/common/bg_001.jpg");
    background-position: 50%;
    background-repeat: repeat;
    background-size: 100% auto;
}



/* ===============================================
 dstListArea（ハワイをもっと楽しむ）　
=============================================== */
/* mapArea（マップエリア）------------------*/
.mapArea {
    margin-top: 2rem;
    position: relative;
}


/* mapArea（マップ上の島々）------------------*/
.mapList > li {
    position: absolute;
}
.mapList > li.lihPh {
    top: 5%;
    width: 21%;
    left: 2%;
}
.mapList > li.hnlPh {
    top: 10%;
    width: 20%;
    left: 22%;
}
.mapList > li.lnyPh {
    width: 15%;
    top: 19%;
    left: 41%;
}
.mapList > li.oggPh {
    width: 26%;
    top: 26%;
    right: 21%;
}
.mapList > li.koaPh {
    width: 29%;
    top: 46%;
    right: 2%;
}



/* ===============================================
 dstList（方面リスト）　
=============================================== */
.dstList li {
    padding: 4.5rem 3.1% 0;
}
.dstList li:last-child {
    padding-bottom: 2rem;
}


/* textTitle（方面タイトル）------------------*/
.dstList .textTitle {
    position: relative;
    padding: 0 4em;
    font-size: 180%;
    text-align: center;
    margin-bottom: 2rem;
    letter-spacing: 2px;
}
.dstList .textTitle:before,.dstList .textTitle:after {
    content: '';
    position: absolute;
    top: 30%;
    display: inline-block;
    width: 33%;
    height: 3px;
    border-top: solid 1px black;
    border-bottom: solid 1px black;
}
.dstList #lihArea .textTitle:before,.dstList #lihArea .textTitle:after {
    content: '';
    position: absolute;
    top: 30%;
    display: inline-block;
    width: 30%;
    height: 3px;
    border-top: solid 1px black;
    border-bottom: solid 1px black;
}
.dstList .textTitle:before {
    left: 0;
}
.dstList .textTitle:after {
    right: 0;
}


/* phArea（方面画像）------------------*/
.dstList .phArea {
    padding: 0 3.1%;
}


/* descText（方面テキスト）------------------*/
.dstList .descText {
    padding: 1rem 0;
    color: #333;
}
.dstList .descText .bigText {
    display: block;
    font-size: 120%;
    font-weight: bolder;
    margin-bottom: 0.3rem;
}
.dstList .descText:last-child {
    padding: 1rem 0 0;
}



/* textBox（ボックステキスト）------------------*/
.dstList .textBox {
    padding: 1rem 3.1%;
    color: #423428;
}
.dstList .textBox .thickText {
    font-weight: bold;
}


/* .linkArea.btn（dstリンクボタン）------------------*/
.dstList .linkArea.btn:last-child {
    margin: 6% 10% 1%;
}



/* ===============================================
 infoArea（トラベルインフォメーション）　
=============================================== */
/* infoArea（背景画像）------------------*/
#islands #infoArea {
    background-image: url("/cmn/img/kanto/hawaii/islands/info_bg_001.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100% auto;
    color: #FFF;
    margin: 0 0 8%;
}


/* infoTitle（タイトル）------------------*/
.infoTitle {
    font-size: 140%;
    text-align: center;
    padding: 3rem 0;
}


/* infoList（リスト）------------------*/
.infoList {
    padding: 0 3.1% 1rem;
}
.infoList > li {
    border-bottom: dashed 1px;
    clear: both;
    overflow: hidden;
    padding: 1rem 2%;
}
.infoList > li:last-child {
    border-bottom: none;
}


/* infoText（リストテキスト）------------------*/
.infoList > li .infoText {
    float: right;
    display: block;
    width: 70%;
}



/* ===============================================
 tourArea（H.I.S.のハワイツアー）　
=============================================== */
/* dstItem（サブタイトル）------------------*/
#tourArea .dstItem {
    margin: 2rem 3.1% 0.5rem;
    padding: 0.7rem;
    border-left: solid 6px #25B4B0;
    border-bottom: solid 1px #25B4B0;
    font-size: 140%;
}


/* api_detail_spr_tour（API詳細）------------------*/
#tourArea .api_detail_spr_tour {
    margin: 0 3.1%;
}