@charset "utf-8";
/****************************************
	01. Main Visual
****************************************/
.responsiveHeight {
	height: 350px;
	padding-bottom: 0;
	position: relative;
	overflow: visible;
	z-index: 1;
}
.responsiveHeight > .inner {
	position: absolute;
	width: 100%;
	height: 100%;
}
.mainSlider {
    position: relative;
    top: 0;
    left: 0;
    overflow: visible;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5);
}
.mainSlider .slider {
	width: 100%;
	height: 100%;
}
.mainSlider .slider .item {
	float: left;
	width: 1140px;
	height: 100%;
	border-left: 0 solid #ffffff;
	border-right: 0 solid #ffffff;
}
.mainSlider .slider .item .mainImg {width: 1140px;}
    .mainSlider .slider .item .captionContent {
        background: rgba(255, 255, 255, 0.5);
        position: absolute;
        width: 100%;
        bottom: -370px;
        color: #ffffff;
        padding: 20px 20px 5px 20px;
        display: inherit;
    }
        .mainSlider .slider .item .captionContent .captionTitle {
            font-size: 18px;
            font-weight: 500;
            color: #ce171f;
            margin: 0 0 5px 0;
            text-transform: uppercase;
        }
.mainSlider .slider .item .captionContent .captionText {
	font-size: 14px;
    color:black;
}
.mainVisual {position: relative; height: 350px;}
.mainVisual .prevButton,
.mainVisual .nextButton {
	position: absolute;
	z-index: 2;
	width: 30px;
	top: 50%;
	margin-top: -25px;
}
.mainVisual .prevButton {left:50%; margin-left:-560px;}
.mainVisual .nextButton {right:50%; margin-right:-560px;}
/********************************************************************************
	02. Tablet Layout
********************************************************************************/
@media screen and (min-width: 0px) and (max-width: 990px) {
	.mainSlider .slider .item,
	.mainSlider .slider .item .mainImg {width: 100%;}	
	.mainVisual .prevButton {left:10px; margin-left:0px;}
	.mainVisual .nextButton {right:10px; margin-right:0px;}	
	.responsiveHeight {height:350px;}
	.mainSlider .slider .item .captionContent .captionTitle {line-height:1.5;}
}
/********************************************************************************
	03. SP Layout
********************************************************************************/

@media screen and (min-width: 0px) and (max-width: 720px) {	
	.mainSlider .slider .item,
	.mainSlider .slider .item .mainImg {width: 100%;}
	.mainVisual,
	.responsiveHeight {height:200px;}
	.mainVisual .prevButton,
	.mainVisual .nextButton {width:15px; margin-top:-12.5px;}
    .mainSlider .slider .item .captionContent {
        width: 100%;
        min-height: 50px;
        padding: 15px 20px 0px 20px;
        background: rgba(255, 255, 255, 0.5);
        display: inherit;
    }
        .mainSlider .slider .item .captionContent .captionTitle {
            font-size: 13px;
            font-weight:600;
            color: #ce171f;
            display: inherit;
        }
        .mainSlider .slider .item .captionContent .captionText {
            font-size: 12px;
            color: #000;
            display: inherit;
        }	
}