@charset "utf-8";


/* top */
/* -------------------------------------------------------- */
#bpCheck {display:block;}

.topObj1 {position:relative; z-index:1;}
.topObj1 .slider .list {-webkit-overflow-scrolling:touch; overflow-scrolling:touch;}
.topObj1 .slider .list li .img {width:100%; padding:56.25% 0 0 0; background-repeat:no-repeat; background-position:center center; background-size:cover; position:relative;}
.topObj1 .slider .list li img {display:block; position:absolute; top:42%; left:0; z-index:1;}
.topObj1 .slider .pagination {width:100%; text-align:center; position:absolute; bottom:5px; left:0;}
.topObj1 .slider .pagination a {width:8px; height:8px; font-size:1px; line-height:1px; vertical-align:middle; margin:0 10px; background-color:#fff; box-shadow:0 0 3px rgba(0,0,0,1); border-radius:50%; box-sizing:content-box; display:inline-block;}
.topObj1 .slider .pagination a:hover {width:16px; height:16px; margin:0 6px;}
.topObj1 .slider .pagination a.on {width:16px; height:16px; margin:0 6px; background-color:#000;}

.topObj2 {position:relative; z-index:10;}
.topObj2 .sec {padding:10px 30px 15px 30px;}
.topObj2 .ttl {width:80px; margin:0 auto;}
.topObj2 .news {margin:-5px 0 0 0;}
.topObj2 .news a {text-decoration:none; color:#fff; display:block;}
.topObj2 .news a:hover {text-decoration:underline;}
.topObj2 .news dl {text-align:left; padding:5px 0; border-bottom:solid 1px #fff;}
.topObj2 .news dt {font-size:1.1rem; margin:0 0 5px 0;}
.topObj2 .news dd {font-size:1.2rem; line-height:1.2;}
.topObj2 .news.on .box {overflow:auto;}
.topObj2 .news.on .btn a {transform:scale(1,-1);}
.topObj2 .box {height:0; margin:0; padding:0; box-sizing:border-box; overflow:hidden; transition:all 0.3s 0s ease;}
.topObj2 .btn {padding:12px 0 0 0;}
.topObj2 .btn a {width:22px; height:22px; margin:0 auto; background:#fff url(../img/common/arrow_04_b.png) no-repeat center center; background-size:14px auto; border-radius:2px; display:block;}

.topObj3 {margin:0; padding:5px 0 0 0;}
.topObj3 ul {display:flex; flex-wrap:wrap;}
.topObj3 li {width:100%; margin:0 0 5px 0; padding:0; box-sizing:border-box;}
.topObj3 a {text-align:center; background-repeat:no-repeat; background-position:center center; background-size:cover; display:block;}
.topObj3 a:hover {opacity:0.7;}
.topObj3 a:hover img {opacity:1;}

.topObj4 {width:100%; text-align:center; margin:0; padding:30px 0 35px 0; background-color:#fff; box-sizing:border-box; position:relative; z-index:10; overflow:hidden;}
.topObj4 .slider {width:320px; margin:0 auto; position:static !important;}
.topObj4 .slider .list {vertical-align:top !important; -webkit-overflow-scrolling:touch; overflow-scrolling:touch;}
.topObj4 .slider .list li {padding:0 5px; vertical-align:top !important; box-sizing:border-box;}
.topObj4 .slider .list li a {text-decoration:none; color:#000;}
.topObj4 .slider .list li .cap {font-size:8px; line-height:1.4; letter-spacing:-0.05em; text-align:left; margin:5px 0 0 0;}
.topObj4 .slider .btn a {width:20px; height:46px; background:#494842 url(../img/common/arrow_05.png) no-repeat center center; background-size:75% auto; display:block; position:absolute; top:63px;}
.topObj4 .slider .btn a:hover {opacity:0.7;}
.topObj4 .slider .btn a.prev {left:0; transform:scale(-1,1);}
.topObj4 .slider .btn a.next {right:0;}

.topObj5 {display:none; position:relative; z-index:10;}

@media screen and (min-width:767px){
	.topObj3 {margin:0 15px; padding:20px 0 30px 0;}
	.topObj3 li {width:50%; margin:20px 0 0 0; padding:0 10px;}
	.topObj3 li:nth-of-type(1),
	.topObj3 li:nth-of-type(2) {margin-top:0;}
}
@media screen and (min-width:1200px){
	#bpCheck {display:none;}
	body.top #contents {margin:0 0 0 263px; padding:0;}

	#topObj {position:relative;}

	.topObj1 {height:100%;}
	.topObj1 .slider {height:100%;}
	.topObj1 .slider .list {height:100%;}
	.topObj1 .slider .list li {height:100%;}
	.topObj1 .slider .list li .img {height:100%; padding:0;}
	.topObj1 .slider .list li img {top:30%;}
	.topObj1 .slider .pagination {bottom:50px;}
	.topObj1 .slider .pagination a {width:14px; height:14px; margin:0 18px;}
	.topObj1 .slider .pagination a:hover,
	.topObj1 .slider .pagination a.on {width:28px; height:28px; margin:0 11px;}

	.topObj2 {width:520px; text-align:left; background-color:rgba(0,0,0,0.5); position:absolute; top:20px; left:20px; z-index:15;}
	.topObj2 .sec {padding:20px 20px 0 20px; box-sizing:border-box;}
	.topObj2 .ttl {width:auto; text-align:center; margin:0;}
	.topObj2 .news {margin:0;}
	.topObj2 .news a {color:#fff;}
	.topObj2 .news dl {margin:20px 0 0 0; padding:0; border-bottom:none; display:flex; align-items:baseline;}
	.topObj2 .news dt {width:100px; font-size:1.1rem; text-align:center; color:#000; background-color:#fff; margin:0; padding:3px 0;}
	.topObj2 .news dd {font-size:1.2rem; line-height:1.2; padding:0 0 0 20px; box-sizing:border-box; flex:1;}
	.topObj2 .btn {padding:10px 0 0 0;}
	.topObj2 .btn a {width:46px; height:46px; background-color:#000; background-image:url(../img/../img/common/arrow_04.png); background-size:26px auto;}
	.topObj2 .box {margin:0 -20px 0 0; padding:0 5px 0 0;}

	.topObj3 {display:none;}

	.topObj4 {width:520px; margin:0; padding:20px; background-color:rgba(0,0,0,0.5); box-sizing:border-box; position:absolute; bottom:20px; left:20px; overflow:hidden;}
	.topObj4 .slider {width:100%; overflow:hidden; position:relative !important;}
	.topObj4 .slider .list li {padding:0 10px; vertical-align:top !important;}
	.topObj4 .slider .list li a {color:#fff;}
	.topObj4 .slider .list li .cap {font-size:1.2rem; margin:5px 0 0 0;}
	.topObj4 .slider .btn a {top:30%;}

	.topObj5 {width:355px; display:block; position:absolute; bottom:20px; right:20px;}
	.topObj5 .search {padding:10px; background-color:rgba(255,255,255,0.7); box-shadow:rgba(0,0,0,0.2) 1px 1px 3px, rgba(0,0,0,0.2) -1px 1px 3px, rgba(0,0,0,0.2) 1px -1px 3px, rgba(0,0,0,0.2) -1px -1px 3px; border-radius:5px; box-sizing:border-box;}
	.topObj5 .search ul {background-color:#fff; border:solid 1px #7f7f7f; border-radius:3px; display:flex;}
	.topObj5 .search ul > li {box-sizing:border-box; align-self:center;}
	.topObj5 .search ul > li.box {flex:1;}
	.topObj5 .search ul > li.box > input {width:100%; padding:5px 10px; background:none; border:none; box-sizing:border-box;}
	.topObj5 .search ul > li.btn {width:22px; display:block;}
	.topObj5 .search ul > li.btn > button {width:22px; height:22px; padding:0; background:url(../img/common/icon_01_04.png) no-repeat center center; background-size:cover; border:none; box-sizing:border-box; display:block;}
}