@charset "utf-8";
/* CSS Document */


/*PC*/
@media print, screen and (min-width: 600px) {


/*----------------------------------------------------

 head

----------------------------------------------------*/
.hedImg { width: 100%; height: 360px; background: url(../images/vision/hedImg.jpg) center center no-repeat; background-size: cover; margin: 0 auto 80px; text-align: center; color: #FFF; padding: 100px 0 0; box-sizing: border-box;}
.hedImg h2 { width: 100%; font-size: 66px; font-family:Arial, Helvetica, sans-serif;}
.hedImg p { width: 100%; font-size: 20px;}

.navBg ul li:nth-of-type(2) a { color: #eb6100;}




/*----------------------------------------------------

 sec01

----------------------------------------------------*/
.sec01 { background: url(../images/vision/sec01Bg.jpg) bottom center no-repeat; background-size: cover; width: 100%; min-height: 1000px;}


/*----------------------------------------------------

 sec01

----------------------------------------------------*/
.sec01 { width: 100%; margin: 0;}
/*.sec01 .w1200 { position: relative;}*/
.sec01 .parallelogram {
	margin: 30px 0 0;
    display: inline-block;
    position: relative;
    z-index: 1;
    padding: 100px 65px 60px 120px;
    color: #000;
}
.sec01 .parallelogram:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    transform: skewY(-10deg);
    background: rgba(255,255,255,0.8);
    content: "";
}
.sec01 .parallelogram h3 { font-size: 48px; color: #eb6100; font-family: "Times New Roman", Times, serif; font-weight: normal; margin: 0 0 20px;}
.sec01 .parallelogram p { font-size: 16px; line-height: 25px;}




/*----------------------------------------------------

 sec02

----------------------------------------------------*/
.sec02 { width: 100%; margin: 0; background: url(../images/vision/sec02TtlBg.jpg) 0 0 no-repeat;}
.sec02 .ttl { padding: 60px 0 80px 120px;}
.sec02 .ttl h2 { font-size: 48px; font-family: "Times New Roman", Times, serif; font-weight: normal; color: #FFF;}

.sec02 .inner { width: 900px; margin: auto auto 50px;}
.sec02 .inner .innerL { float: left; width: 305px; text-align: right;}
.sec02 .inner .innerL img { width: 240px; height: auto;}
.sec02 .inner .innerR { float: right; width: 545px;}
.sec02 .inner .innerR h3 { font-size: 30px; font-family: Arial, Helvetica, sans-serif; color: #eb6100; margin: 0 0 20px;}
.sec02 .inner .innerR h4 { font-size: 22px; font-family: "Times New Roman", Times, serif; line-height: 30px; margin: 0 0 20px; font-weight: normal;}
.sec02 .inner .innerR p { font-size: 16px; margin: 0 0 10px; line-height: 180%;}
.sec02 .inner .innerR p.name { text-align: right; font-size: 22px; font-family: "Times New Roman", Times, serif;}
.sec02 .inner .innerR p.name span { font-size: 13px; margin-right: 1em;}






/*----------------------------------------------------

 sec03

----------------------------------------------------*/
.sec03 { width: 100%; margin: 0 0 60px; background: #eaf0f5; max-height: 720px;}
.sec03 .w1200 { position: relative; overflow: hidden;}
.sec03 .w1200 .imgL { position: absolute; width: 629px !important; top: -5px; left: 0; z-index: 10;}
.sec03 .w1200 .imgL img { width: 100%; height: auto;}

.sec03 .w1200 .parallelogram {
	float: right;
	margin: 80px 0 0 auto;
    display: inline-block;
    position: relative;
    z-index: 1;
    padding: 60px 65px 60px 300px;
    color: #000;
}
.sec03 .w1200 .parallelogram:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    transform: skewY(-10deg);
    background: rgba(255,255,255,0.8);
    content: "";
}
.sec03 .w1200 .parallelogram h3 span { font-size: 19px; color: #000; font-family: "Times New Roman", Times, serif; margin: 0 0 20px;}
.sec03 .w1200 .parallelogram h3 span::before { content: "-"; margin-right: 10px;}
.sec03 .w1200 .parallelogram h3 span::after { content: "-"; margin-left: 10px;}
.sec03 .w1200 .parallelogram h3 { font-size: 34px; color: #000; font-family: "Times New Roman", Times, serif; margin: 0 0 20px; font-weight: normal;}
.sec03 .w1200 .parallelogram ol { font-size: 18px; line-height: 36px; list-style: none; counter-reset: item; width: 450px;}
.sec03 .w1200 .parallelogram ol li { text-indent: -0.8em; padding-left: 0.8em; line-height: 160%; margin: 0 0 10px;}
.sec03 .w1200 .parallelogram ol li:before { counter-increment: item; content: counter(item)'.';}



}



/*sp*/
@media only screen and (max-width: 599px) {

/*----------------------------------------------------

 head

----------------------------------------------------*/
.hedImg { width: 100%; height: 180px; background: url(../images/vision/hedImg.jpg) center center no-repeat; background-size: cover; margin: 0 auto 40px; text-align: center; color: #FFF; padding: 50px 0 0; box-sizing: border-box;}
.hedImg h2 { width: 100%; font-size: 30px; font-family:Arial, Helvetica, sans-serif;}
.hedImg p { width: 100%; font-size: 18px;}

.navBg ul li:nth-of-type(2) a { color: #eb6100;}




/*----------------------------------------------------

 sec01

----------------------------------------------------*/
.sec01 { background: url(../images/vision/sec01Bg.jpg) bottom center no-repeat; background-size: cover; width: 100%; min-height: 1000px;}


/*----------------------------------------------------

 sec01

----------------------------------------------------*/
.sec01 { width: 100%; margin: 0;}
/*.sec01 .w1200 { position: relative;}*/
.sec01 .parallelogram {
	margin: 30px 0 0;
    display: inline-block;
    position: relative;
    z-index: 1;
    padding:50px 20px 20px;
    color: #000;
}
.sec01 .parallelogram:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    transform: skewY(-10deg);
    background: rgba(255,255,255,0.8);
    content: "";
}
.sec01 .parallelogram h3 { font-size: 36px; color: #eb6100; font-family: "Times New Roman", Times, serif; font-weight: normal; margin: 0 0 20px;}
.sec01 .parallelogram p { font-size: 15px; line-height: 22px;}




/*----------------------------------------------------

 sec02

----------------------------------------------------*/
.sec02 { width: 100%; margin: 0; background: url(../images/vision/sec02TtlBg.jpg) 0 0 no-repeat;}
.sec02 .ttl { padding: 20px;}
.sec02 .ttl h2 { font-size: 36px; font-family: "Times New Roman", Times, serif; font-weight: normal; color: #FFF;}

.sec02 .inner { width: 94%; margin: auto auto 50px;}
.sec02 .inner .innerL { float: none; width:60%; margin:auto;}
.sec02 .inner .innerL img { width: 100%; height: auto;}
.sec02 .inner .innerR { float: none; width:100%;}
.sec02 .inner .innerR h3 { font-size:26px; font-family: Arial, Helvetica, sans-serif; color: #eb6100; margin: 0 0 20px;}
.sec02 .inner .innerR h4 { font-size: 24px; font-family: "Times New Roman", Times, serif; line-height: 160%; margin: 0 0 20px; font-weight: normal;}
.sec02 .inner .innerR p { font-size: 16px; margin: 0 0 20px; line-height: 160%;}}
.sec02 .inner .innerR p.name { text-align: right; font-size: 20px; font-family: "Times New Roman", Times, serif;}
.sec02 .inner .innerR p.name span { font-size: 13px; margin-right: 1em;}






/*----------------------------------------------------

 sec03

----------------------------------------------------*/
.sec03 { width: 100%; margin: 0 0 60px; background: #eaf0f5;}
.sec03 .w1200 { position: relative;}
.sec03 .w1200 .imgL { width: 94%; margin: 0 auto;}
.sec03 .w1200 .imgL img { width:100%; height:auto;}

.sec03 .w1200 .parallelogram {
	margin:30px 0 0 auto;
    position: relative;
    z-index: 1;
    padding: 20px;
    color: #000;
}
.sec03 .w1200 .parallelogram:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    transform: skewY(-10deg);
    background: rgba(255,255,255,0.8);
    content: "";
}
.sec03 .w1200 .parallelogram h3 span { font-size: 20px; color: #000; font-family: "Times New Roman", Times, serif; margin: 0 0 20px;}
.sec03 .w1200 .parallelogram h3 { font-size: 34px; color: #000; font-family: "Times New Roman", Times, serif; margin: 20px 0 10px; font-weight: normal;}
.sec03 .w1200 .parallelogram ol { font-size: 18px; line-height: 30px; list-style: none; counter-reset: item;}
.sec03 .w1200 .parallelogram ol li { text-indent: -0.8em; padding-left: 0.8em;}
.sec03 .w1200 .parallelogram ol li:before { counter-increment: item; content: counter(item)'.';}

  
	
	
	
}