@charset "UTF-8";
@media screen and (min-width: 768px),print {
main {background: #F9F5E9; width: 100%!important; max-width: 1920px!important; margin: 0 auto -360px !important; padding-bottom: 480px;}

#main-bx{}
#main-bx .bx{width: 1280px; margin: -90px auto 0; background: url(../images/performance/main-bg.png) no-repeat top 78px right; padding: 80px 0 55px;}
#main-bx .bx .inner{width: 900px; margin: 0 auto; position: relative;}
#main-bx .bx .inner .ttl1{font-size: 28px; letter-spacing: 0.3px; line-height: 1.45; text-align: center; font-weight: bold; color: #181C62; margin-bottom: 8px; position: relative; z-index: 1;}
#main-bx .bx .inner .ttl1 span{font-size: 44px;}
#main-bx .bx .inner .ttl2{font-size: 38px; letter-spacing: 0.3px; line-height: 1.45; text-align: center; font-weight: bold; color: #181C62; margin-bottom: 55px; padding-left: 18px;}
#main-bx .bx .inner .ttl2 span{font-size: 70px; letter-spacing: 3px; background: url(../images/performance/main-ttl-icon.png) no-repeat top -5px center; padding: 30px 0 40px 10px; position: relative; z-index: 0;}
#main-bx .bx .inner .txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; text-align: center; font-weight: 500; }
#main-bx .bx .inner .icon1{position: absolute; left: 44px; top: 98px;}
#main-bx .bx .inner .icon2{position: absolute; right: 40px; top: 80px;}

#main-bx .in-bx1 {width: 100%; margin: 0 auto; background: #181C62; padding: 55px 0 0;}
#main-bx .in-bx1 .in-inner1{width: 1000px; margin: 0 auto; }
#main-bx .in-bx1 .in-inner1 .in-ttl1{font-size: 32px; letter-spacing: 0.3px; line-height: 1.45; text-align: center; font-weight: bold; color: #fff; margin-bottom: 13px; }
#main-bx .in-bx1 .in-inner1 .in-ttl1 span{font-size: 48px; color: #FFF100;}
#main-bx .in-bx1 .in-inner1 .in-txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.75; text-align: center; font-weight: 500; color: #fff; margin-bottom: 34px;}
#main-bx .in-bx1 .in-inner1 .in-img1{width: 100%; margin: 0 auto; padding-left: 38px;}



#main-bx .main-last-bigimg {width: 100%; margin: 0 auto; border-top: 2px solid #171C61;  border-bottom: 2px solid #171C61;}

#main-bx .loop {
width: 100%;
height: 67px; /*画像の高さ等*/
background: url(../images/performance/main-big-img.png) repeat-x #fff;
background-position: center;
animation: bgloop 30s linear infinite; /*秒数等はお好きな数値に、infiniteは残す*/
}

@keyframes bgloop {
from { background-position: 0 center; }
to { background-position: -1986px 0; /*-1000px部分は画像の横幅と同じ数値*/ }
}



#con1 {}
#con1 .bx{width: 100%; margin: 0 auto; background: url(../images/performance/con1-bg.png) no-repeat top center; padding: 90px 0 397px;;}
#con1 .bx .inner{width: 1100px; margin: 0 auto; position: relative; }
#con1 .bx .inner .ttl{ font-size: 42px; letter-spacing: 0px; line-height: 1.3; font-weight: bold; color: #fff; text-align: center; margin-bottom: 33px;}
#con1 .bx .inner .ttl span{ font-size: 48px; color: #FFF100;}
#con1 .bx .inner .txt{ font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; text-align: center; font-weight: 500; color: #fff; margin-bottom: 34px;}


.all-bg {background: #fff; }

#con2 {width: 100%; margin: 0 auto; background: #fff; border-bottom: 2px solid #171C61; }
#con2 .all-bx{width: 1200px; margin: 0 auto; padding: 79px 0 0; border-left: 2px solid #171C61;  border-right: 2px solid #171C61;}


#con2 .bx1{width: 1200px; margin: 0 auto; position: relative;}
#con2 .bx1 .inner{}
#con2 .bx1 .inner .in-bx1{width: 1200px; margin: 0 auto 102px; position: relative;}
#con2 .bx1 .inner .in-bx1 .in-inner1{width: 500px; margin-right: auto; margin-left: 48px;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 28px; letter-spacing: 0px; line-height: 1.6; font-weight: bold; color: #181C62; margin-bottom: 30px; }
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl2{font-size: 20px; letter-spacing: 0px; line-height: 1.55; font-weight: bold; color: #181C62; margin-bottom: 20px;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; font-weight: 500; margin-bottom: 30px;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-img1{position: absolute; right: 4px; top: 0;}


#con2 .bx2{width: 1200px; margin: 0 auto; position: relative;}
#con2 .bx2 .inner{}
#con2 .bx2 .inner .in-bx1{width: 1200px; margin: 0 auto 157px; position: relative;}
#con2 .bx2 .inner .in-bx1 .in-inner1{width: 500px; margin-right: auto; margin-left: 48px;}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 28px; letter-spacing: 0px; line-height: 1.6; font-weight: bold; color: #181C62; margin-bottom: 30px; }
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; font-weight: 500; margin-bottom: 30px;}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-img1{position: absolute; right: 4px; top: 0;}


#con2 .bx3{width: 1200px; margin: 0 auto; position: relative;}
#con2 .bx3 .inner{}
#con2 .bx3 .inner .in-bx1{width: 1200px; margin: 0 auto 110px; position: relative;}
#con2 .bx3 .inner .in-bx1 .in-inner1{width: 500px; margin-right: auto; margin-left: 48px;}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 28px; letter-spacing: 0px; line-height: 1.6; font-weight: bold; color: #181C62; margin-bottom: 30px; }
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; font-weight: 500; margin-bottom: 30px;}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-img1{position: absolute; right: 4px; top: 0;}


#con2 .bx4{width: 1200px; margin: 0 auto; position: relative;}
#con2 .bx4 .inner{}
#con2 .bx4 .inner .in-bx1{width: 1100px; margin: 0 auto; background: #181C62; padding: 50px 0 43px; position: relative; left: -4px;}
#con2 .bx4 .inner .in-bx1 .in-inner1{}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list{display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li{width: 406px; margin-right: 120px; position: relative;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li:first-child:after{content: ""; width: 1px; height: 175px; margin: 0 auto; background: #fff; position: absolute; left: 467px; right: 0; top: 0;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li:last-child{margin-right: 0; }
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li .in-ttl1{font-size: 24px; letter-spacing: 0px; line-height: 1.6; font-weight: bold; text-align: center; color: #181C62; background: #fff; border-radius: 50px; margin-bottom: 20px; padding: 5px 0px;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li .in-txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.95; font-weight: 500; color: #fff; }


.last-bx{width: 100%; margin: 0 auto; background: #fff;}
.last-bx .last-inner{width: 1200px; margin: 0 auto; padding: 30px 0 24px; border-left: 2px solid #171C61;  border-right: 2px solid #171C61;}


#con3 {}
#con3 .bx{width: 100%; margin: 0 auto; background: url(../images/performance/con3-bg.png) no-repeat bottom center #EFE8D8; padding: 53px 0 20px;;}
#con3 .bx .inner{}
#con3 .bx .inner .ttl1{font-size: 32px; letter-spacing: 0px; line-height: 1.6; font-weight: bold; text-align: center; color: #181C62; margin-bottom: 24px; }
#con3 .bx .inner .ttl1 span{font-size: 42px; }
#con3 .bx .inner .txt1{font-size: 15px; letter-spacing: 0.3px; line-height: 1.85; font-weight: 500; text-align: center; margin-bottom: 103px; padding-right: 65px;}
#con3 .bx .inner .txt1 span{font-size: 20px; font-weight: bold; color: #181C62;}
#con3 .bx .inner .ttl2{text-align: center; margin-bottom: 30px;}
#con3 .bx .inner .img1{text-align: center; }


.last-ttl {text-align: center; padding: 100px 0 25px;}


}






@media screen and (max-width: 767px) {
.seo_bread_list {display: none;}
main {background: #F9F5E9; padding-top: 9vw; padding-bottom: 33vw; margin-bottom: -19vw;}

#main-bx{}
#main-bx .bx{width: 90%; margin: 0 auto; background: url(../images/performance/sp-main-bg.png) no-repeat top 40vw center; padding: 1vw 0 10vw; background-size: 100%;}
#main-bx .bx .inner{width: 100%; margin: 0 auto;}
#main-bx .bx .inner .ttl1{font-size: 5.5vw; letter-spacing: 0.2vw; line-height: 1.45; text-align: center; font-weight: bold; color: #181C62; margin-bottom: 5vw; position: relative; z-index: 2;}
#main-bx .bx .inner .ttl1 span{font-size: 7.5vw;}
#main-bx .bx .inner .ttl2{font-size: 5.8vw; letter-spacing: 0.1vw; line-height: 1.45; text-align: center; font-weight: bold; color: #181C62; margin-bottom: 18vw; position: relative; z-index: 1;}
#main-bx .bx .inner .ttl2 span{font-size: 11vw; letter-spacing: 0.5vw; line-height: 1; background: url(../images/performance/sp-main-ttl-icon.png) no-repeat top -1vw center; padding: 5vw 5vw 10vw 5vw; position: relative; z-index: -1; background-size: 90%; margin: 0 -4vw;}
#main-bx .bx .inner .txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 1.95; font-weight: 500; }
#main-bx .bx .inner .icon1{width: 10vw; position: absolute; left: 12vw; top: 32vw;}
#main-bx .bx .inner .icon2{width: 11vw; position: absolute; right: 15vw; top: 30vw;}

#main-bx .in-bx1 {width: 100%; margin: 0 auto; background: #181C62; padding: 12vw 0 0;}
#main-bx .in-bx1 .in-inner1{width: 100%; margin: 0 auto; }
#main-bx .in-bx1 .in-inner1 .in-ttl1{font-size: 5.5vw; letter-spacing: 0.2vw; line-height: 1.25; text-align: center; font-weight: bold; color: #fff; margin-bottom: 3vw; }
#main-bx .in-bx1 .in-inner1 .in-ttl1 span{font-size: 11.5vw; color: #FFF100;}
#main-bx .in-bx1 .in-inner1 .in-txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 1.95; font-weight: 500; color: #fff; margin-bottom: 3vw; padding: 0 5vw;}
#main-bx .in-bx1 .in-inner1 .in-img1{width: 100%; margin: 0 auto; padding-left: 6vw; padding: 0 3vw;}


#main-bx .main-last-bigimg {width: 100%; margin: 0 auto; border-top: 2px solid #171C61;  border-bottom: 2px solid #171C61;}

#main-bx .loop {
width: 100%;
height: 14vw;
background: url(../images/performance/sp-main-big-img.png) repeat-x center center #fff;
background-size: 200vw;
animation: bgloop 30s linear infinite;
}

@keyframes bgloop {
from { background-position: 0 center; }
to { background-position: -200vw center; }
}



#con1 {}
#con1 .bx{width: 100%; margin: 0 auto; background: url(../images/performance/sp-con1-bg.png) no-repeat top center; padding: 8vw 0 78vw; background-size: 100%;}
#con1 .bx .inner{width: 90%; margin: 0 auto; position: relative; }
#con1 .bx .inner .ttl{ font-size: 5.5vw; letter-spacing: 0.2vw; line-height: 1.3; font-weight: bold; color: #fff; text-align: center; margin-bottom: 7vw;}
#con1 .bx .inner .ttl span{ font-size: 7.5vw; color: #FFF100;}
#con1 .bx .inner .txt{ font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 2.05; font-weight: 500; color: #fff; }


.all-bg {background: #F9F5E9; }

#con2 {width: 100%; margin: 0 auto; background: #fff; }
#con2 .all-bx{width: 100%; margin: 0 auto; padding: 10vw 0 0; background: #fff;}


#con2 .bx1{width: 100%; margin: 0 auto 15vw; position: relative;}
#con2 .bx1 .inner{}
#con2 .bx1 .inner .in-bx1{width: 100%; margin: 0 auto 10vw; position: relative;}
#con2 .bx1 .inner .in-bx1 .in-inner1{width: 100%; margin: 0 auto 6vw;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 6.5vw; letter-spacing: 0.3vw; line-height: 1.65; font-weight: bold; color: #181C62; margin-bottom: 8vw; padding: 0 5vw 0 6vw;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-ttl2{font-size: 4.6vw; letter-spacing: 0.2vw; line-height: 1.55; font-weight: bold; color: #181C62; margin-bottom: 5vw; padding: 0 5vw;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 2; font-weight: 500; margin-bottom: 7vw; padding: 0 5vw;}
#con2 .bx1 .inner .in-bx1 .in-inner1 .in-img1{width: 100%; margin: 0 auto;}


#con2 .bx2{width: 100%; margin: 0 auto 15vw; position: relative;}
#con2 .bx2 .inner{}
#con2 .bx2 .inner .in-bx1{width: 100%; margin: 0 auto 10vw; position: relative;}
#con2 .bx2 .inner .in-bx1 .in-inner1{width: 100%; margin: 0 auto 6vw;}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 6.5vw; letter-spacing: 0.3vw; line-height: 1.65; font-weight: bold; color: #181C62; margin-bottom: 8vw; padding: 0 5vw 0 6vw;}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 2; font-weight: 500; margin-bottom: 7vw; padding: 0 5vw;}
#con2 .bx2 .inner .in-bx1 .in-inner1 .in-img1{width: 100%; margin: 0 auto;}


#con2 .bx3{width: 100%; margin: 0 auto 8vw; position: relative;}
#con2 .bx3 .inner{}
#con2 .bx3 .inner .in-bx1{width: 100%; margin: 0 auto; position: relative;}
#con2 .bx3 .inner .in-bx1 .in-inner1{width: 100%; margin: 0 auto 6vw;}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1{font-size: 6.5vw; letter-spacing: 0.3vw; line-height: 1.65; font-weight: bold; color: #181C62; margin-bottom: 8vw; padding: 0 5vw 0 6vw;}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1 .ss1{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-ttl1 .ss2{background: linear-gradient(transparent 70%, #FFF100 70%);}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 1.95; font-weight: 500; margin-bottom: 7vw; padding: 0 5vw;}
#con2 .bx3 .inner .in-bx1 .in-inner1 .in-img1{width: 100%; margin: 0 auto;}


#con2 .bx4{width: 100%; margin: 0 auto; position: relative;}
#con2 .bx4 .inner{}
#con2 .bx4 .inner .in-bx1{width: 90%; margin: 0 auto -38vw; background: #181C62; padding: 10vw 5vw 9vw; position: relative; }
#con2 .bx4 .inner .in-bx1 .in-inner1{}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list{}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li{width: 100%; margin: 0 auto 19vw; position: relative;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li:first-child:after{content: ""; width: 100%; height: 1px; margin: 0 auto; background: #fff; position: absolute; left: 0; right: 0; top: 62vw;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li:last-child{margin-bottom: 0; }
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li .in-ttl1{font-size: 5vw; letter-spacing: 0.3vw; line-height: 1.65; font-weight: bold; text-align: center; color: #181C62; background: #fff; border-radius: 20vw; margin-bottom: 5vw; padding: 2vw 0px;}
#con2 .bx4 .inner .in-bx1 .in-inner1 .list li .in-txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 1.95; font-weight: 500; color: #fff; }


.last-bx{width: 100%; margin: 0 auto; background: #F9F5E9;}
.last-bx .last-inner{width: 100%; margin: 0 auto; padding: 31vw 0 20vw; }


#con3 {}
#con3 .bx{width: 100%; margin: 0 auto; background: url(../images/performance/sp-con3-bg.png) no-repeat top 111vw center #EFE8D8; padding: 13vw 0 0; background-size: 100%; position: relative;}
#con3 .bx .inner{}
#con3 .bx .inner .ttl1{font-size: 5.8vw; letter-spacing: 0vw; line-height: 1.4; font-weight: bold; text-align: center; color: #181C62; margin-bottom: 6vw;}
#con3 .bx .inner .ttl1 span{font-size: 9.5vw; }
#con3 .bx .inner .txt1{font-size: 3.6vw; letter-spacing: 0.1vw; line-height: 1.7; font-weight: 500; margin-bottom: 9vw; padding: 0 5vw 10vw;}
#con3 .bx .inner .txt1 span{font-size: 4.9vw; font-weight: bold; color: #181C62;}
#con3 .bx .inner .ttl2{width: 100%; margin: 0 auto; padding-right: 3vw; padding-bottom: 73vw;}
#con3 .bx .inner .img1{width: 90%; margin: 0 auto; position: absolute; left: 0; right: 0; bottom: -25vw;}



.last-ttl {width: 80%; margin: 0 auto 0vw; text-align: center; padding: 39vw 1vw 6vw 0vw;}


}