@charset "utf-8";
/**
 * 
 * 青森空港ビル
 * 
 * slider CSS
 * 
 * スライダー用スタイルシート。原則として編集不可。
 * フロントページのみ読み込まれる。（ is_fron_page() == true ）
 * 
 */

header {
    /*height: 100vh;*/
}
.topContainer {
    /*height: 100vh;*/
}
.globalNaviContainer {
	height: 100vh; /*height: calc(100vh + 60px);*/
}
body.admin-bar .globalNaviContainer {
	height: calc(100vh - 46px);
}

#imageSliderLoading {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    background-color: rgba(0,0,0,0.5);
    background-image: url(./img/common/icon_loader_d_gw_01_s1.gif);
    background-repeat: no-repeat;
    background-position: center center;
    /*background-size: cover;*/
    z-index: 50;
    display: none;
}
#imageSliderLoading.load {
	display: block;
}
#imageSliderLoading.ready {
	display: none;
}

/* 
 * ■スライダー --------------------------------------------------
 */
.imageSliderContainer {
	position: absolute; top: 50px;
    width: 100%; /*height: 100vh;*/ height: calc(100vh - 50px);
}
body.admin-bar .imageSliderContainer {
	height: calc(100vh - 46px - 50px);
}

.imageSliderContainer .sliderTemp {
    margin: 0;
    width: 100%; height: 100%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.imageSliderContainer .scroll-main {
	margin-bottom: 0;
	position: absolute; bottom: 40px; left: 0;
	width: 100%;
	text-align: center;
	z-index: 60;
}
.imageSliderContainer .scroll-main a {

	color: #fff;
	padding: 50px 0 0 0;
	display: inline-block;
	width: 50px; height: 50px;
	font-size: 8px; font-size: 0.8rem; font-weight: 400; text-align: center;
	line-height: 14px; line-height: 1.4rem;
	vertical-align: bottom;
	background: transparent url(img/common/scroll_bg.png) no-repeat center top;
	background-size: contain;
}
.imageSliderContainer .scroll-main a:hover {
	width: 52.5px; height: 52.5px;
	font-size: 8px; font-size: 0.8rem;
	
	-webkit-transition: all 0.15s ease-in-out 0s;
	-moz-transition: all 0.15s ease-in-out 0s;
	-o-transition: all 0.15s ease-in-out 0s;
	-ms-transition: all 0.15s ease-in-out 0s;
	transition: all 0.15s ease-in-out 0s;
}

.imageSliderContainer .memberonly {
	margin-bottom: 0;
	padding-right: 0;
	position: absolute; bottom: 80px; right: 15px;
	width: 50px;
	text-align: right;
	z-index: 60;
}
.imageSliderContainer .memberonly a {
	color: #000;
	padding: 32px 0 0 0;
	/*border: 1px solid #fff;*/
	display: inline-block;
	width: 50px; height: 50px;
	font-size: 8px; font-size: 0.8rem; font-weight: 400; text-align: center;
	line-height: 8px; line-height: 0.8rem;
	vertical-align: bottom;
	background: transparent url(img/common/memberonly_bg.png) no-repeat center top;
	background-size: contain;
}
.imageSliderContainer .memberonly a:hover {
	width: 52.5px; height: 52.5px;
	font-size: 8px; font-size: 0.8rem;
	
	-webkit-transition: all 0.15s ease-in-out 0s;
	-moz-transition: all 0.15s ease-in-out 0s;
	-o-transition: all 0.15s ease-in-out 0s;
	-ms-transition: all 0.15s ease-in-out 0s;
	transition: all 0.15s ease-in-out 0s;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
	.imageSliderContainer {
		top: 70px;
	    height: calc(100vh - 70px);
	}
	body.admin-bar .imageSliderContainer {
		top: 70px;
		height: calc(100vh - 46px - 70px);
	}

	.imageSliderContainer .scroll-main {
		bottom: 100px;
	}
	.imageSliderContainer .scroll-main a {
		padding: 50px 0 0 0;
		width: 50px; height: 50px;
		font-size: 14px; font-size: 1.4rem;
		line-height: 16px; line-height: 1.6rem;
	}
	.imageSliderContainer .scroll-main a:hover {
		width: 50px; height: 50px;
		font-size: 14px; font-size: 1.4rem;
	}
	.imageSliderContainer .memberonly {
		bottom: 50px;
		width: 100px;
	}
	.imageSliderContainer .memberonly a {
		padding: 60px 0 0 0;
		width: 100px; height: 85px;
		font-size: 14px; font-size: 1.4rem;
		line-height: 14px; line-height: 1.4rem;
		line-height: 16px; line-height: 1.6rem;
	}
	.imageSliderContainer .memberonly a:hover {
		width: 105px; height: 89px;
		font-size: 16px; font-size: 1.6rem;
	}
}
@media (min-width: 992px) {
	.globalNaviContainer {
        min-height: 600px;
	}
	body.admin-bar .globalNaviContainer {
		height: calc(100vh - 32px);
        min-height: calc(600px - 32px);
	}
	.imageSliderContainer {
		top: 100px;
	    height: calc(100vh - 100px);
        min-height: calc(600px - 100px);
	}
	body.admin-bar .imageSliderContainer {
		top: 100px;
		height: calc(100vh - 32px - 100px);
        min-height: calc(600px - 32px - 100px);
	}
}
@media (min-width: 1200px) {

}



.imageSliderContainer .bx-wrapper {
	margin-bottom: 0;
}

.imageSlider {
	color: #fff;
	margin: 0 auto; padding: 0;
	position: relative;
	width: 100%;
	height: calc(100vh - 50px);
	overflow: hidden;
	list-style: none;

	visibility: hidden;
}
	.imageSlider > li {
		margin: 0; padding: 0;
		position: absolute;
		width: 100%; height: 100%;
		z-index: 1;
	}
	.imageSlider li > *,
	.imageSlider li > .sliderInner> * {
		position: absolute;
		-webkit-transition-timing-function: ease-in-out;
		-moz-transition-timing-function: ease-in-out;
		-ms-transition-timing-function: ease-in-out;
		-o-transition-timing-function: ease-in-out;
		transition-timing-function: ease-in-out;
	}
	.imageSlider li > .sliderInner {
		margin-right: auto; margin-left: auto;
		padding-right: 15px; padding-left: 15px;
		top: 0; right: 0; left: 0; width: 100%; height: 100%;
	}
body.admin-bar .imageSlider {
	height: calc(100vh - 46px - 50px);
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
	.imageSlider {
		height: calc(100vh - 70px);
	}
	body.admin-bar .imageSlider {
		height: calc(100vh - 46px - 70px);
	}
	.imageSlider li > .sliderInner {
		width: 750px;
	}
}
@media (min-width: 992px) {
	.imageSlider {
		height: calc(100vh - 100px);
        min-height:  calc(600px - 100px);
	}
	body.admin-bar .imageSlider {
		height: calc(100vh - 32px - 100px);
        min-height:  calc(600px - 32px - 100px);
	}
	.imageSlider li > .sliderInner  {
		width: 970px;
	}
}
@media (min-width: 1200px) {
	.imageSlider {
		height: calc(100vh - 100px);
        min-height:  calc(600px - 100px);
	}
	body.admin-bar .imageSlider {
		height: calc(100vh - 32px - 100px);
        min-height:  calc(600px - 32px - 100px);
	}
	.imageSlider li > .sliderInner  {
		width: 1170px;
	}
}

@media print {
	.imageSlider {
		height: 550px;
	}
}

.imageSlider.load {
	visibility: hidden;		/* 最初は非表示 */
}
.imageSlider.ready {
	visibility: visible;	/* 読み込み終わったらvisible */
}



/* 
 * ■スライダー各子要素 --------------------------------------------------
 */
.imageSlider .slide-bg {
	top: 0; right: 0; bottom: 0 ;left: 0;
	width: 100%; height: 100%;
	z-index: 50;
	opacity: 1;
	background-repeat: no-repeat; background-position: center center; background-size: cover;
}
.imageSlider .animate-in .slide-bg {
	z-index: 50;
}
.imageSlider .animate-out .slide-bg {
	z-index: 50;
}

.imageSlider .slide-title,
.imageSlider .slide-description,
.imageSlider .slide-arrow {
	-webkit-transition-duration: 1.3s;
	-moz-transition-duration: 1.3s;
	-o-transition-duration: 1.3s;
	-ms-transition-duration: 1.3s;
	transition-duration: 1.3s;
}

.imageSlider .slide-title {
	right: 10%; bottom: 150%;
	width: 80%;
	padding: 0 0px 0;
	font-size: 16px; font-size: 1.6rem; font-weight: 400;
	text-align: left;
	line-height: 20px; line-height: 2.0rem;
	letter-spacing: -0.025em;

	text-shadow: 1px 1px 5px #000;
	opacity: 0;
	z-index: 51;
}
.imageSlider .animate-in .slide-title {
	right: 10%; bottom: 70%;
	opacity: 1;
}
.imageSlider .animate-out .slide-title {
	right: 150%; bottom: 70%;
	opacity: 0;
}

.imageSlider .slide-description {
	right: 10%; top: 150%;
	width: 80%;
	padding: 0 0px 0;
	font-size: 12px; font-size: 1.2rem; font-weight: 400;
	text-align: left;
	line-height: 16px; line-height: 1.6rem;
	letter-spacing: -0.025em;

	text-shadow: 1px 1px 5px #000;
	opacity: 0;
	z-index: 51;
}
.imageSlider .animate-in .slide-description {
	right: 10%; top: 35%;
	opacity: 1;
}
.imageSlider .animate-out .slide-description {
	right: 150%; top: 35%;
	opacity: 0;
}

.imageSlider .slide-arrow {
	left: 150%; top: 80%;
	/*width: 80%;*/
	text-align: left;
	opacity: 0;
	z-index: 51;
}
.imageSlider .animate-in .slide-arrow {
	left: 10%; top: 80%;
	opacity: 1;
}
.imageSlider .animate-out .slide-arrow {
	left: -150%; top: 80%;
	opacity: 0;
}
.imageSlider .slide-arrow a {
	color: #fff;
	padding: 10px;
	font-size: 14px; font-size: 1.4rem; font-weight: 400; text-align: left;
	line-height: 16px; line-height: 1.6rem;
    background: #ffbb68;
	border-radius: 4px;
	box-shadow: 0px 0px 10px #000;
}
.imageSlider .slide-arrow a:hover {
	font-size: 15px; font-size: 1.5rem;
}

.imageSlider .slide-arrow a span.cursor {
	margin-right: 5px;
	display: inline-block; width: 14px; height: 14px;
	background: transparent url(img/common/kuwashiku_cursor.png) no-repeat center top;
	background-size: contain;
}
@media (min-width: 576px) {

}
@media (min-width: 768px) {
	.imageSlider .slide-title {
        right: 10%; bottom: 150%;
		font-size: 28px; font-size: 2.8rem; font-weight: 400;
		width: 80%;
		line-height: 32px; line-height: 3.2rem;
	}
	.imageSlider .animate-in .slide-title {
		right: 10%; bottom: 55%;
	}
	.imageSlider .animate-out .slide-title {
		right: 150%; bottom: 55%;
	}

	.imageSlider .slide-description {
        right: 10%; top: 150%;
		font-size: 14px; font-size: 1.4rem; font-weight: 400;
		width: 80%;
		line-height: 18px; line-height: 1.8rem;
	}
	.imageSlider .animate-in .slide-description {
		right: 10%; top: 50%;
	}
	.imageSlider .animate-out .slide-description {
		right: 150%; top: 50%;
	}

	.imageSlider .slide-arrow  {
        left: 150%; top: 70%;
	}
    .imageSlider .animate-in .slide-arrow {
        left: 10%; top: 70%;
    }
    .imageSlider .animate-out .slide-arrow {
        left: -150%; top: 70%;
    }
	.imageSlider .slide-arrow a {
		font-size: 18px; font-size: 1.8rem; font-weight: 400;
		line-height: 20px; line-height: 2.0rem;
	}
	.imageSlider .slide-arrow a:hover {
		font-size: 18px; font-size: 1.8rem;
	}
	
	.imageSlider .slide-arrow a span.cursor {
		width: 18px; height: 18px;
	}
}
@media (min-width: 992px) {
	.imageSlider .slide-title {
        right: 52%; bottom: 150%;
		font-size: 28px; font-size: 2.8rem; font-weight: 400;
		width: 45%;
		line-height: 32px; line-height: 3.2rem;
	}
	.imageSlider .animate-in .slide-title {
		right: 52%; bottom: 55%;
	}
	.imageSlider .animate-out .slide-title {
		right: 150%; bottom: 55%;
	}

	.imageSlider .slide-description {
        right: 52%; top: 150%;
		font-size: 14px; font-size: 1.4rem; font-weight: 400;
		width: 45%;
		line-height: 18px; line-height: 1.8rem;
	}
	.imageSlider .animate-in .slide-description {
		right: 52%; top: 50%;
	}
	.imageSlider .animate-out .slide-description {
		right: 150%; top: 50%;
	}

	.imageSlider .slide-arrow  {
        left: 150%; top: 70%;
	}
    .imageSlider .animate-in .slide-arrow {
        left: 3%; top: 70%;
    }
    .imageSlider .animate-out .slide-arrow {
        left: -150%; top: 70%;
    }
}
@media (min-width: 1200px) {

}



/* 
 * ■ページャー --------------------------------------------------
 */
.imageSliderPager {
	margin-top: 0;  margin-bottom: 0;
	padding-top: 0; padding-bottom: 0;
	position: absolute; left: 0; bottom: 0; right: 0;
	z-index: 60;
}
.imageSliderPager.bx-pager-custom a {
}
.imageSliderPager.bx-pager-custom a.active {
}
.imageSliderPager.bx-pager-custom a:hover {
}










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

@media (min-width: 576px) {

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

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

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

}