@charset "utf-8";
/**
 * 
 * 青森空港ビル
 * 
 * front CSS
 * 
 * フロントページ用スタイルシート。
 * フロントページのみ読み込まれる。（ is_fron_page() == true ）
 * 
*/

/*
 * ヘッダ --------------------------------------------------
*/





/* 
 * バナー --------------------------------------------------
 */
.bannerContainer {
    margin-top: 60px;
    padding: 0;
}
.bannerSliderContainer {
    margin: 0px auto;
}





/* 
 * フライトインフォメーション・INFORMATION --------------------------------------------------
 */
.fidsInfoContainer {
    margin: 0; margin-top: 30px;
    z-index: 40;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {

}
@media (min-width: 992px) {
    .fidsInfoContainer {
        margin-top: 0;
        position: absolute; top: 25%; left: 50%;
        /*position: absolute; bottom: 25%; left: 50%;*/
        width: 48%;
    }
}
@media (min-width: 1200px) {

}
/* 高さで位置を変える */
@media (min-height: 800px) {
    .fidsInfoContainer {
        top: 28%;
        /*bottom: 28%;*/
    }
}
@media (min-height: 900px) {
    .fidsInfoContainer {
        top: 33%;
        /*bottom: 33%;*/
    }
}
@media (min-height: 1000px) {
    .fidsInfoContainer {
        top: 40%;
        /*bottom: 40%;*/
    }
}





/* 
 * フライトインフォメーション --------------------------------------------------
 */
.fidsContainer {
    margin: 0 0 20px 0;
    border: none;
    border-radius: 4px;
}
.fidsContainer .fidsHead {
    color: #000;
    border: none;
    background-color: #fff;
    border-radius: 4px;
}
.fidsContainer .fidsBody {
    color: #fff;
    border: none;
    background-color: #336699;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.fidsContainer .fidsHead h2 {
    color: #336699;
    font-size: 1.4rem;
    margin-bottom: 0;
}
.fidsContainer .fidsHead .nowReload {
    text-align: right;
}
.fidsContainer .fidsHead .reloadButton {
    color: #000;
    background-color: #ffbb68;
}
.fidsContainer .fidsHead .reloadButton img {
    width: 14px; height: auto;
}

.fidsContainer .fidsHead .selectButtonList {
    width: 100%;
    margin: 0 auto;
}
.fidsContainer .fidsHead .selectButtonList li {
    width: 44%;
    margin: 0 3%;
    text-align: center;
}
.fidsContainer .fidsHead .selectButtonList li a {
    color: #369;
    border: 1px solid #ccc;
    background-color: #fff;
}
.fidsContainer .fidsHead .selectButtonList li a.active {
    color: #fff;
    border: 1px solid #ccc;
    background-color: #369;
}

.fidsTable {
    color: #fff;
    background-color: transparent;
}
.table-hover.fidsTable tbody tr:hover {
    /*color: #212529;*/ color: #fff;
    /*background-color: rgba(0,0,0,.075);*/ background-color: rgba(0,0,0,.2);
}
.fidsTable thead th {
    border-bottom: none;
}
.fidsTable th,
.fidsTable td {
    padding: 0.3rem;
    border-top: none; border-bottom: 1px solid #dee2e6;
}
.fidsTable tbody th:before,
.fidsTable tbody td:before {
    content: "";
    display: block; float: left;
}

.fidsTable th.number,
.fidsTable th.airport,
.fidsTable th.std,
.fidsTable th.etd,
.fidsTable th.sta,
.fidsTable th.eta,
.fidsTable th.notes,
.fidsTable td.number,
.fidsTable td.airport,
.fidsTable td.std,
.fidsTable td.etd,
.fidsTable td.sta,
.fidsTable td.eta,
.fidsTable td.notes {
    
}
.fidsTable th.number,
.fidsTable td.number { width: 20%; }
.fidsTable th.airport,
.fidsTable td.airport { width: 24%; }
.fidsTable th.std,
.fidsTable th.etd,
.fidsTable th.sta,
.fidsTable th.eta,
.fidsTable td.std,
.fidsTable td.etd,
.fidsTable td.sta,
.fidsTable td.eta { width: 14%; }
.fidsTable th.notes,
.fidsTable td.notes { width: 28%; }

.fidsTable .airlineImg {
    margin-right: 5px;
    display: inline-block;
    width: 50px; height: auto;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {

}
@media (min-width: 992px) {
    .fidsContainer .fidsHead h2 {
        margin-top: 5px;
    }
}
@media (min-width: 1200px) {

}





/* 
 * フライトインフォメーション --------------------------------------------------
 */
.dfsContainer {
    margin: 0 0 20px 0;
    border: none;
    border-radius: 4px;
}
.dfsContainer img {
    width: 100%; height: auto;
    border-radius: 4px;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {

}
@media (min-width: 992px) {

}
@media (min-width: 1200px) {

}





/* 
 * INFORMATION --------------------------------------------------
 */
.informationContainer {
    color: #ffd800;
    margin: 0; padding: 0;
    position: relative;
    background-color: #336699;
    border-radius: 4px;
}
.informationContainer > div {
    margin: 0; padding: 0;
}
.informationContainer h2 {
    color: #336699;
    margin: 0; padding: 5px 10px;
    font-size: 1.4rem;
    /*line-height: 26px;*/
    background-color: #ffd800;
    border-radius: 4px;
}
.informationContainer .infoList {
    margin: 0; padding: 5px 10px;
    position: relative;
    height: 26px;
    list-style: none outside;
    overflow: hidden;
}
.informationContainer .infoList li {
    color: #ffd800;
    margin: 0; padding: 0;
    position: absolute; top: 4px; left: 100%;
    display: hidden;
    white-space: nowrap;
}
.informationContainer .infoList li.current {
    display: inline;
}
.informationContainer .infoList li a {
    color: #ffd800;
    white-space: nowrap;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
    .informationContainer h2 {
        text-align: center;
    }
}
@media (min-width: 992px) {
    .informationContainer h2 {
        font-size: 1.2rem;
        text-align: center;
        line-height: 26px;
    }
    .informationContainer .infoList li {
        top: 8px;
    }
}
@media (min-width: 1200px) {

}





/* 
 * りんご --------------------------------------------------
 */
.appleContainer {
    /*margin-top: 60px;*/ margin-top: 15px;
}
.appleContainer p {
    margin: 0 auto;
    text-align: center;
}
.appleContainer p img {
    width: 50px; height: auto;
}





/* 
 * メインアイコン --------------------------------------------------
 */
.mainIconContainer {
    margin-top: 60px;
}
.iconCardWeather,
.iconCardAomori {
    
}

.iconCardContainer {
    margin-top: 30px;
}
/*
b7df20	48cb7d
336699	336699
ffd800	ffbb68
48cb7d	116200
e57aa5	cf0020
*/
.iconCardWeather {
    border-color: #48cb7d;
    background-color: #b7df20;
}
.iconCardAomori {
    border-color: #cf0020;
    background-color: #e57aa5;
}
.iconCardWeather .card-header,
.iconCardWeather .card-footer,
.iconCardAomori .card-header,
.iconCardAomori .card-footer {
    background-color: transparent;
}

.iconCardWeather a,
.iconCardAomori a {
    text-decoration: none;
}

.iconCardWeather h2,
.iconCardAomori h2 {
    margin-bottom: 0;
    font-size: 1.8rem;
    text-align: center;
}
.iconCardWeather h2 {
    color: #000;
}
.iconCardAomori h2 {
    color: #fff;
}

.iconCardWeather .card-body,
.iconCardAomori .card-body {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.iconCardWeather .card-body { background-color: #fff; }
.iconCardAomori .card-body { background-image: url(img/front/mainicon_bg_aomori.jpg); }

.iConCardBodyInner {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100px;
}
.iconCardRestaurant .card-body .iConCardBodyInner { align-items: flex-end; }

.iConCardBodyInner > p {
    margin-bottom: 0;
    font-size: 1.6em; font-weight: 700; 
    text-align: center;
    line-height: 1.5;
}
.iconCardWeather .iConCardBodyInner > p { color: #666666; }
.iconCardAomori .iConCardBodyInner > p { color: #fff; text-shadow: 1px 1px 5px #000; }


.iconButtonContainer {
    margin-top: -3rem!important;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

/*
parking
floor
access
wifi
inquiries
*/

.iconButton {
    margin-right: 4%; margin-left: 4%;
    width: 42%;
    text-align: center;
}

.iconButton img {
    width: 100%; height: auto;
    border-radius: 4px;
}
.iconButton h2 {
    margin-bottom: 0;
    font-size: 1.8rem;
    text-align: center;
}
.iconButton a {
    color: #000;
}
.iconButton a h2 {
    text-decoration: underline;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
    .iconButtonContainer {
        justify-content: space-around;
    }
    .iconButton {
        margin-right: 1%; margin-left: 1%;
        width: 17.6%;
    }
}
@media (min-width: 992px) {

}
@media (min-width: 1200px) {

}





/* 
 * NEWS --------------------------------------------------
 */
.newsContainer {
    margin-top: 60px;
    padding-right: 0; padding-bottom: 0px; padding-left: 0;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.newsContainer .newsTitle {
    color: #fff;
    margin: 0 auto 30px auto;
    padding-top: 10px; padding-bottom: 10px;
    text-align: center;
    background-color: #48cb7d;
}
.newsContainer .newsTitle img {
    width: 80px; height: auto;
}

.newsContainer .container {
    padding-right: 0; padding-left: 0;
}
.frontNewsList {
    margin-right: 0; margin-left: 0;
    padding-right: 15px; padding-left: 15px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
.frontNewsList .newsCard {
    /*padding-right: 15px; padding-left: 15px;*/
    background-image: none;
    max-width: 48%;
}

.newsCard {
}
.newsCard a {
    text-decoration: none;
}
.newsCard .card-header,
.newsCard .card-body,
.newsCard .card-footer {
    color: #000;
    text-align: center;
}
.newsCard .card-body {
    padding: 0;
}

.newsCard .newsCategory {
    background-color: #ffbb68;
}
.newsCard .newsDate {
    background-color: #d9f76d;
}
.newsCard .newsTitle {
    background-color: #ffffff;
}

.newsCard .newsTitle h3 {
    margin-top: 0; margin-bottom: 0;
    padding: 0;
    border: 0;
    font-size: 1.4rem; font-weight: 400;
    text-align: left;
}
.newsCard .newsTitle h3:before {
    content: none;
}
.newsCard a .newsTitle h3 {
    color: #007bff;
}
.newsCard a:hover .newsTitle h3 {
    text-decoration: underline;
}
.newsCard p {
    margin-bottom: 0;
}
.newsCard .newsThum {
    width: 100%; height: auto;
}

.moreNewsButton {
    color: #fff;
    margin-bottom: 0;
    padding: 0.8rem;
    border-color: #48cb7d;
    background-color: #48cb7d;
}

@media (min-width: 576px) {
    .frontNewsList {
        padding-right: 0; padding-left: 0;
    }
}
@media (min-width: 768px) {

.newsContainer {
    padding-bottom: 30px; 
    background-image: url(img/front/news_bg.jpg);
}
}
@media (min-width: 992px) {

}
@media (min-width: 1200px) {

}





/* 
 * SNS --------------------------------------------------
 */
.snsContainer {
    margin-top: 60px;
}
.snsContainer .snsTitle {
    margin-bottom: 30px;
    width: 100%;
    text-align: center;
}
.snsContainer .snsTitle img {
    width: 200px; height: auto;
}


.snsContainerYoutube,
.snsContainerFacebook,
.snsContainerInstagram {
    width: 100%;
    text-align: left;
}
.snsContainerYoutube {
    margin-bottom: 45px;
}
.snsContainerFacebook {
    margin-bottom: 45px;
}
.snsContainerInstagram {
    margin-bottom: 0px;
}

.snsContainerYoutube .snsTitleYoutube,
.snsContainerFacebook .snsTitleFacebook,
.snsContainerInstagram .snsTitleInstagram {
    width: 100%;
    text-align: left;
}
.snsContainerYoutube .snsTitleYoutube,
.snsContainerFacebook .snsTitleFacebook,
.snsContainerInstagram .snsTitleInstagram {
    margin-bottom: 15px;
    width: 100%;
    text-align: left;
}
.snsContainerYoutube .snsTitleYoutube img,
.snsContainerFacebook .snsTitleFacebook img,
.snsContainerInstagram .snsTitleInstagram img {
    width: 140px; height: auto;
}
.snsContainerYoutube .snsContainerYoutubeRingo {
}
.snsContainerYoutubeRingo .ringoTextColumn {
    background-color: transparent;
}
.snsContainerYoutubeRingo .snsTitleYoutubeRingo {
    margin-bottom: 15px;
    width: 100%;
    text-align: left;
}
.snsContainerYoutubeRingo .snsTitleYoutubeRingo img {
    width: 100%; height: auto;
    max-width: 360px;
}
.snsContainerYoutubeRingo .ringoText {
    width: 100%;
}

.moreSNSButton {
    border-color: #89afde;
    padding: 0.8rem;
    background-color: #89afde;
}

@media (min-width: 576px) {

}
@media (min-width: 768px) {
    .snsContainerYoutubeRingo .ringoTextColumn {
        margin-bottom: 10px;
        background-color: transparent;
        background-image: url(img/front/ringo_bg.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        background-size: 190px auto;
    }
    .snsContainerYoutubeRingo .ringoText {
        width: 500px;
    }
}
@media (min-width: 992px) {
    .snsContainerYoutube {
        margin-bottom: 45px;
    }
    .snsContainerFacebook {
        margin-bottom: 0px;
    }
    .snsContainerInstagram {
        margin-bottom: 0px;
    }

    .snsContainerYoutubeRingo .ringoTextColumn {
        margin-bottom: 0px;
        background-position: left bottom;
        background-size: 160px auto;
    }
    .snsContainerYoutubeRingo .ringoText {
        width: auto;
    }
}
@media (min-width: 1200px) {
    .snsContainerYoutubeRingo .ringoTextColumn {
        background-size: 180px auto;
    }
}









/* 
 * 青森空港ビルからの重要なお知らせ・デスクトップカレンダー --------------------------------------------------
 */
.importantCalendarContainer {
    margin-top: 60px;
    position: relative;
    background-color: #ffbb68;
}
.importantCalendarContainer > .container {
    padding-top: 15px; padding-bottom: 15px;
}



/* 
 * 青森空港ビルからの重要なお知らせ --------------------------------------------------
 */
.importantContainer {
}
.importantContainer h3 {
    margin-top: 0;
}
.importantContainer h4 {
    margin-top: 0; margin-bottom: 0;
}

.importantContainer ul {
    padding-left: 40px!important;
    list-style: disc outside!important;
}
.importantContainer ul li {
    padding-left: 0!important;
    background-image: none!important;
}

.inspectionColumn {
    
}
.inspectionColumn + .inspectionColumn  {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #ccc;
}

.moreImportantButton {
    color: #fff;
    padding: 0.8rem;
}



/* 
 * デスクトップカレンダー --------------------------------------------------
 */
.calendarContainer {
    position: relative;
    z-index: 1;
    display: none;
}

.calendarHikorin {
    margin: 0;
    position: absolute; right: 0; bottom: 20px;
    width: 80%;
}
.calendarHikorin img {
    width: 100%; height: auto;
}

.importantCalendarContainer .calenderBg {
    margin: 0; padding: 0;
    position: absolute; top: 0; right: 0; bottom: 0; left: 50%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: cover;
    z-index: 0;
    display: none;
}

@media (min-width: 576px) {

}
@media (min-width: 768px) {

}
@media (min-width: 992px) {
    .calendarContainer {
        display: block;
    }
    .importantCalendarContainer .calenderBg {
        display: block;
    }
}
@media (min-width: 1200px) {

}









/* 
 * ■（項目名） --------------------------------------------------
 */

@media (min-width: 576px) {

}
@media (min-width: 768px) {

}
@media (min-width: 992px) {

}
@media (min-width: 1200px) {

}