@charset "utf-8";

.ds-index-padding-b {padding:10% 0;}
.ds-index-padding-a {padding:8% 0;}
.ds-index-padding-c {padding:5% 0;}
.ds-index-padding-a-top{padding-top:8%;}
.ds-index-padding-a-bottom{padding-bottom:8%;}

.ds-index-margin-a-bottom{margin-bottom:8%;}

#ds-index-1 {background-image:url('../layout/img/mbn202.jpg'); background-size:cover; background-position:center center;}
#ds-index-1>div>div {display:flex; align-items:stretch; justify-content:center;}
#ds-index-1>div>div>div {flex:0 0 50%; width:50%;}

#ds-index-1a {font-size:1.5rem; color:#000; font-weight:bold; padding-top:5%;}
#ds-index-1a >div:first-child{font-size:0; text-align:right; padding-right:15%; box-sizing:border-box;}
#ds-index-1a >div:first-child img{width:35%; height:auto;}
#ds-index-1a >div:nth-of-type(2){margin:3% 0; line-height:1.4; font-size:1.55em;}
#ds-index-1a span{display:block;text-shadow:#fff 0 0 0.6rem;}
#ds-index-1a a {display:inline-block; line-height:1; background:#02343F; color:#fff; padding:0.5em 1em; border-radius:0.8em 0;}

#ds-index-1b>div+div {margin-top:3%;}
#ds-index-1b>div>div {position:relative; width:100%; height:0; padding-bottom:56.25%; }
#ds-index-1b img {width:100%; height:auto;}
#ds-index-1b iframe {width:100%; height:100%; display:block;}

#ds-index-1b-1 {border-radius:50px 50px 50px 0; overflow:hidden;}
#ds-index-1b-1 >div,
#ds-index-1b-2 >div {position:absolute; width:100%; height:100%;}

#ds-index-1b-2 {display:flex; justify-content:space-between; align-items:stretch;}
#ds-index-1b-2>div {position:relative; width:48%; height:0; padding-bottom:55.3846%;overflow:hidden; border-radius:50px 50px 50px 0;}

.ds-index-title-a {line-height:1; text-align:center;}
.ds-index-title-a *{display:block; line-height:1.5; margin:0;}
.ds-index-title-a h3 {font-size:2.1em;}

#ds-index-8 {border-width:10px 0; border-style:solid; border-color:#02343F;}

/*
#ds-index-3a h3 {font-size:1.6em;}
#ds-index-3a p {font-size:2.1em; color:#F9BA25; font-weight:bold; margin:0.5em 0 0 0;}
#ds-index-3a p span,
#ds-index-3a h3 span,
.ds-index-title-a h3 span{display:inline-block;}

#ds-index-3b ul a,
#ds-index-3b ul span {display:block;}
.ds-index-3b-1 {position:relative; width:100%; height:0; padding-bottom:115%; text-align:center;}
.ds-index-3b-1a {position:absolute; width:100%; height:100%; left:0; top:0;  font-size:0;}
.ds-index-3b-1a img{height:auto; width:100%; margin:0 auto;}
.ds-index-3b-1b {z-index:1; width:100%; color:#fff; display:block; position:absolute; bottom:0.5em; font-size:1.5rem; line-height:1; opacity:0; transition:opacity 0.5s;}
#ds-index-3b ul a:hover .ds-index-3b-1b {opacity:1;}
.ds-index-3b-1b span {background:#02343F; display:inline-block!important; padding:0.5em 1em; border-radius:0.5em 0; font-size:0.9em; font-weight:normal}
#ds-index-3b ul a:hover img {transform:scale(1.01,1.01)}

#ds-index-3b {width:100%;}
#ds-index-3b>ul {display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:stretch;}
#ds-index-3b>ul>li{flex:0 0 20%; max-width:20%; padding:3% 1% 0 1%; box-sizing:border-box;}
#ds-index-3b>ul>li>a{border-left:1px solid #ddd;}
*/
/* #ds-index-3b .swiper-slide-active+li, */
/* #ds-index-3b .swiper-slide-active+li+li+li, */
/* #ds-index-3b>ul>li:nth-of-type(2n) {background:#fafafa;} */
/*
.ds-index-3b-2 {text-align:center; font-size:1rem; padding:1em 0 1.5em 0;}
.ds-index-3b-2a,
.ds-index-3b-2c {color:#02343F}
.ds-index-3b-2a {font-size:1.2em; font-weight:bold; margin:0.5em 0;}
.ds-index-3b-2b {font-size:1em; margin:0.5em 0;}
.ds-index-3b-2c {font-size:1.8em; font-weight:bold;}
*/

/* 3nd */
.ds-index-3 h2 {font-size:1.7em;}
.ds-index-3 h3 {font-size:1.5em;}
#ds-index-3-A {font-size:0; text-align:center;}
#ds-index-3-A>div {max-width:1600px;}
#ds-index-3-A a{width:100%; display:inline-block;}
#ds-index-3-A img{width:100%; height:auto; margin-top:5%;}
.ds-index-3-B {background:#02343F; text-align:center; color:#fff; padding:2em 0; }
.ds-index-3-B h2 {margin:0;}
.ds-index-3-B a {display:inline-block;}
@media all and (min-width:768px){
	.ds-index-3 {margin-bottom:10px;}
	.ds-index-3-B ul {margin-top:1em;}
	.ds-index-3-B li {display:inline-block;}
	.ds-index-3-B li+li:before {content:"·"; margin:0 0.5em;}
	.ds-index-3-B a:hover {color:mistyrose;}
}

#ds-index-4 {background:url('../layout/img/mbn301.jpg') center right no-repeat; background-size:cover; position:relative;}
#ds-index-4>.ds-lt-width {display:flex; justify-content:flex-start; align-items:stretch; z-index:1; position:relative;}
#ds-index-4>.ds-lt-width>div:first-child {color:#fff;}
#ds-index-4>.ds-lt-width>div:first-child h3 {font-size:2.3em; font-weight:normal; margin:0 0 1em 0;}
#ds-index-4>.ds-lt-width>div:first-child h3 span{display:block;}
.ds-index-4-bg {position:absolute; background:#02343F; opacity:0.8!important; width:50%; height:100%; left:0; top:0; transition-duration:3s!important;}
.ds-index-4-bg:not(.aos-animate) {transform:translate3d(-100%,0,0)}

#ds-index-4 ul {line-height:1.9; font-size:1.3em; }
#ds-index-4 li:before{background:url('../layout/img/icon407.png') center center no-repeat; background-size:cover; display:inline-block; width:1em; height:1em; content:""; vertical-align:middle; margin:0 0.7em 3px 0;}

#ds-index-5 ul {display:flex; justify-content:center; align-items:stretch; text-align:center; font-size:0;}
#ds-index-5 li {flex:0 0 12%;}
#ds-index-5 li a{display:block;}
#ds-index-5 ul img {width:100%; height:auto;}
#ds-index-5 li a:hover img{transform:scale(1.05,1.05)}

#ds-index-7 {background:#eee; color:#02343F}
#ds-index-7 a {display:block;}
#ds-index-7 ul {display:flex; justify-content:center; align-items:stretch; text-align:center; font-weight:bold;}
#ds-index-7 li {flex:0 0 10%;}
#ds-index-7 li~li {margin-left:2%;}
#ds-index-7 ul img {width:100%; height:auto;}
#ds-index-7 li div:nth-of-type(1) {font-size:0;}
#ds-index-7 li div:nth-of-type(2) {font-size:1.2em; white-space:nowrap; line-height:1; margin:0.5em 0 0 0; display:block;}

#ds-index-7b {text-align:center;}
#ds-index-7b p{font-weight:bold; font-size:1.6em; margin:2em 0;}
#ds-index-7b a{display:inline-block; background:rgba(255,255,255,0.9); line-height:1; padding:0.5em 2em; font-size:1.3em; border-radius:1em 0; border:2px solid #02343F; transition:all 0.5em;}
#ds-index-7b a:hover {background:#fff;}