/*@ latest 2019.12.19 ssj */
/*@ latest 2021.06.24 OSY */

/* main visual -float widget */
.mainvalBox {/* max-width:1300px; */margin:0 auto;padding:0px;box-sizing:border-box;}
.mainvalBox .mainVisual {width:100%; float:left;}
.mainvalBox .mainVisual #templateFix {float:left;width:100%;/* margin-bottom: 15px; */margin-top: 300px;}
.mainvalBox .mainVisual #templateFix .transform_wrap .layout_02_36 {width:100%;}

	@media (min-width:900px){
		.transform_wrap .layout_01 {width:49.5%;float:left;margin-right: 1%;height: 610px !important;}
		.transform_wrap .layout_01 .add_div {line-height:610px;}
		.transform_wrap .inner_layer {width: 49.5%;float:left;}
		.transform_wrap .swiper-container.mainSlider_001 {width: 49.5%;margin-right:1%;}
	}
	@media (min-width:600px){
		.transform_wrap .layout_02 {width: 100%;}
		.transform_wrap .layout_04 {width: 49%;margin-right: 2%;}
		.transform_wrap .layout_height_M {height:250px;}
		.transform_wrap .layout_height_H {height:350px;}
		.transform_wrap .layout_04:last-child {margin-right:0;}
		.transform_wrap .layout_02.layout_height_M {height:250px !important;}
	}



/* main visual */
.mainVisual .mainSlider_001 {background:white;z-index:0;overflow:hidden;margin-left: auto;margin-right: auto;position: relative;}
.mainVisual .swiper-slide {position:relative;overflow:hidden;width: 100% !important;}
.mainVisual .swiper-slide img {width:100%; height:auto;}

/*copy*/
.copy {position:absolute;z-index:9;width:100%;word-break:keep-all;opacity: 1 !important;left: 0;}
.copy .inner {width:100%; max-width:1300px; padding:0; margin:0 auto; box-sizing:border-box;}
.copy .inner div {padding: 0 15px;}
.copy h3 {font-weight:400;line-height:normal;color: #fff;}
.copy p.smallp {font-size: 15px;line-height: 25px;/* letter-spacing:-0.5px; */padding-top: 20px;color: white;}

	@media (min-width:1050px){
		.copy {top:200px !important;}
		.mainVisual .mainSlider_001 {height: 1300px;}
		.mainVisual .mainSlider_001 .swiper-wrapper {height: 100%;}
		.mainVisual .swiper-slide {height: 100%;}
		.mainVisual .swiper-slide img {height: 100%;}
		.copy h3 {font-size: 27px;} 
	}
	@media (max-width:1049px){
		.maintem_wide {width:100%; float:left;}
		.mainVisual {position:absolute; width:100%; height:100%;}
		.mainVisual .mainSlider_001 {height:100%;}
		.mainVisual .swiper-slide {height:100%;}
	}

	@media (min-width:800px) and (max-width:1049px){
		.copy h3 {font-size:28px;}
		.mainVisual .swiper-slide img {min-height:860px;}
	}

	@media (min-width:600px) and (max-width:1399px){
		.copy .inner div {padding:0 60px;}
		.copy.copy_position_lh .inner div {padding-left:15px;}
		.copy.copy_position_rh .inner div {padding-right:60px; padding-left:15px;}
	}

	@media (max-width:799px){
		.swiper-slide .copy {-webkit-transform: translateY(50px) !important; transform: translateY(50px) !important; top:40px;}
		.swiper-slide.swiper-slide-active .copy {-webkit-transform: translateY(0px) !important;transform: translateY(0px) !important;/* top:40px; */}

		.mainVisual .swiper-slide img {width:auto !important; min-width:100%; height:auto !important; min-height:100%;
									   position:absolute; top:-9999px; bottom:-9999px; left:-9999px; right:-9999px; margin:auto;}							
	}
	@media (min-width:600px) and (max-width:799px){
		.copy h3 {font-size:25px;}
		.copy p.smallp {font-size:14px;}
	}
	@media (max-width:599px){
		.copy h3, .copy h3 font {font-size:19px; line-height:25px; color:#333 !important;}
		.copy p.smallp,.copy p.smallp font {font-size:13px; line-height:20px; padding-top:10px; color:#333 !important;}	
	}



#templateFix {position:absolute; width:100%;}

	@media (min-width:1050px){
		#templateFix {top:320px; z-index:0;}
	}
	@media (min-width:1050px) and (max-width:1300px){
		#templateFix {padding:0 15px;box-sizing: border-box;}
	}
	@media (max-width:1049px){
		#templateFix {position:relative;float:left; margin: 200px 0 80px;width:100%; padding:0 15px;box-sizing:border-box;height:auto;top: 40px;}
	    .copy.copy_position_ch {top:100px;}
	}
	@media (max-width:899px){
		.inner_layer {padding-top:15px;width: 100%;}
	}

	@media (max-width:599px){
		#templateFix {margin: 110px 0 80px;}
		.copy.copy_position_ch {
    top: 50px;
}
	}










/* main slide */
.mainwidget_slide {width:100%; height:100%; float:left; position:relative; overflow:hidden;}
.mainwidget_slide .swiper-container {height: 100%;}
.mainwidget_slide .bnr_p {width:100%;height:100%;position:absolute;top:0;left:0;box-sizing:border-box;text-align:left;line-height: normal;}
.mainwidget_slide .bnr_p .bnr_p_wrap {width: 70%;display:inline-block;vertical-align:middle;box-sizing:border-box; line-height:normal;}
.mainwidget_slide .swiper-slide {width: 100%; text-align: right; background:#fff;}
.mainwidget_slide .swiper-slide> a {width: 100%; height: 100%; float: left; position: relative; line-height: 610px;}
.mainwidget_slide .swiper-slide img {width:100%; height:100%; display: inline-block;}

.mainwidget_slide .bnr_p strong {
							line-height: 130%;
							font-weight: 400;
							letter-spacing:-1px;
							color: #fff;
							display: inline-block;
							white-space:nowrap;
							overflow:hidden;
							text-overflow:ellipsis;
							box-sizing:border-box;
							text-align: inherit;
							background: #ff8a00;
							padding: 2px 8px 2px 5px;
							margin-top: 3px;
							}
.mainwidget_slide .bnr_p h4 {
						width:100%;
						line-height: 130%;
						font-weight: 200;
						letter-spacing:-1px;
						color: #333;
						white-space:nowrap;
						overflow:hidden;
						text-overflow:ellipsis;
						box-sizing:border-box;
						}
.mainwidget_slide .bnr_p p {
					   font-size: 17px;
					   color: #838383;
					   line-height: 130%;
					   width:auto;
					   display:inline-block;
					   position:relative;
					   word-break:keep-all;
					   overflow:hidden;
					   white-space:normal;
					   -webkit-box-orient:vertical;
					   display:-webkit-box;
					   opacity:0.9;
					   margin-top: 50px;
					   }



	@media (min-width:600px){
		.layout_01 .mainwidget_slide .bnr_p p {-webkit-line-clamp:9; max-height:180px;}
	}

	@media (min-width:800px){
		.mainwidget_slide .bnr_p h4 {font-size: 36px;}
		.mainwidget_slide .bnr_p strong {font-size: 36px;}
		.mainwidget_slide .bnr_p .bnr_p_wrap {padding: 50px 30px 30px 40px;}
	}

	@media (max-width:799px){
		.mainwidget_slide .bnr_p h4 {font-size: 25px;}
		.mainwidget_slide .bnr_p strong {font-size: 25px;}
		.mainwidget_slide .bnr_p .bnr_p_wrap {width:70%; padding:20px 20px 25px 15px;}
	}

	@media (min-width:599px) and (max-width:899px){
        .mainwidget_slide .swiper-container {max-height:500px;}
	}

	@media (min-width:600px) and (max-width:799px){
		.mainwidget_slide {/* height:350px; */}
		.mainwidget_slide .bnr_p {/* line-height:350px; */}
	}

	@media (max-width:599px){
		.mainwidget_slide {height: 450px;}
		.mainwidget_slide .bnr_p {line-height:300px;}
		.mainwidget_slide .bnr_p p {max-height:157px; -webkit-line-clamp:8;}
		.mainwidget_slide .swiper-slide>a {line-height: 500px;}
		.mainwidget_slide .swiper-slide img {opacity:0.8;}
	}



	
.mainwidget_slide .btnbox {width:100%;float:left;display:block;text-align:center;position:absolute;bottom:20px;text-align: left;padding-left: 20px;box-sizing: border-box;}

.mainwidget_slide .swiper-pagination {display:inline-block;position:relative;margin-left: 10px;vertical-align: middle;}
.mainwidget_slide .swiper-pagination .swiper-pagination-bullet {width:10px;height:10px;margin-right:4px;background:#73645f;opacity: 0.4;border: 1px solid #fff;}
.mainwidget_slide .swiper-pagination .swiper-pagination-bullet:focus {outline:thin dotted;}
.mainwidget_slide .swiper-pagination .swiper-pagination-bullet-active {/* background: #333; */opacity: 1;}

.mainwidget_slide .slide-controll {display:inline-block; width:auto;}
.mainwidget_slide .swiper-button-next,
.mainwidget_slide .swiper-button-prev {
								  overflow:hidden;
								  text-indent:-9999px;
								  width: 30px;
								  height: 30px;

								  background-color: #989796 !important;
								  border-radius: 100%;
								  position:relative;
								  margin-top:0;
								  display:inline-block;
								  top:auto;
								  margin-right: 10px;
								  left:auto;
								  vertical-align: middle;
								  pointer-events:auto !important;
								  }
.mainwidget_slide .swiper-button-prev {background: url(/sample/template/compound/compound011/img/arrow.png) no-repeat 4px 3px;}
.mainwidget_slide .swiper-button-next {background: url(/sample/template/compound/compound011/img/arrow.png) no-repeat -57px 4px;margin-left:6px;}
.mainwidget_slide .swiper-button-next:hover,
.mainwidget_slide .swiper-button-prev:hover {cursor:pointer; }
.mainwidget_slide .swiper-button-next:focus,
.mainwidget_slide .swiper-button-prev:focus {outline:thin dotted;}

.mainwidget_slide .swiper-button-next.swiper-button-disabled, 
.mainwidget_slide .swiper-button-prev.swiper-button-disabled {opacity:1;}

.mainwidget_slide div.indicator {z-index:10;display:inline-block;margin-left:-13px;position:relative;}
.mainwidget_slide div.indicator button {outline:none;cursor:pointer;text-indent:-9999px;background-color: #989796 !important;width: 30px;height: 30px;border-radius: 100%;display: inline-block;margin-right: 5px;}
.mainwidget_slide div.indicator button.play {border-radius: 100%;}
.mainwidget_slide div.indicator button.play {background: url(/sample/template/compound/compound011/img/arrow.png) no-repeat -82px 4px;}
.mainwidget_slide div.indicator button.stop {background: url(/sample/template/compound/compound011/img/arrow.png) no-repeat -26px 3px;}
.mainwidget_slide div.indicator button:focus {outline:thin dotted;}