/* ------------------------------
css for coralgranddivers.com
directored by miho tomofuji
http://ad5.jp/
------------------------------ */


/* トップページ用CSS */

.index_topbox {
    background-attachment: fixed;
    position: relative;
}

.box-flex {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; margin-bottom: 5px;}
.box-flex .box-flex-title {display: inline-block; margin: 0; color: #fff; padding: 5px 15px; font-size: 1.1em; font-weight: normal; text-align: left; line-height: .9rem;}
.box-flex .button_link {margin: 0; white-space: nowrap;}

/* オンラインツアー */
.online-tour-box {text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
.online-tour-title {color: #04484c; padding: 20px; background-color: rgba(255, 255, 255, .7); border-radius: 10px; z-index: 1;}
.online-tour:hover .online-tour-title {background: rgba(61, 201, 179, 0.85); -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; animation: item_fadein .5s ease infinite;}

@media (max-width: 480px) {
    .index_topbox {
        background-attachment: inherit;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    #balloon_box {
        background: linear-gradient(135deg, rgb(255, 255, 255, .6), rgba(255, 255, 255, 0));
    }
}

/*スマホ横向きのみ*/
@media (max-device-width: 896px) and (orientation: landscape) {
    .index_topbox {
        background-attachment: inherit;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    #balloon_box {
        background: linear-gradient(135deg, rgb(255, 255, 255, .6), rgba(255, 255, 255, 0));
    }
}