@charset "utf-8";

body{
font-family: helvetica, arial, meiryo, san-serif;
}


.js-on .LpFlowSection,
.js-on ,LpSectionWrap{
position: relative;
}

/* LpFlowPanelWrap */
.js-on .LpFlowPanelWrap + .LpFlowPanelWrap{
display: none;
}
.js-on .LpFlowSlide .LpFlowClmHdg button{
outline: none;
}
.js-on .LpFlowSlide .LpFlowClmHdg button.LpFlowOpenBtn{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
cursor: pointer;
display: block;
font-size: 0;
}
.js-on .LpFlowSlide.open .LpFlowClmHdg button.LpFlowOpenBtn{
display: none;
}

/* LpFlowPanel */
.LpFlowPanel{
width: 100%;
vertical-align: middle;
text-align: center;
}
.js-on .LpFlowPanel{
padding: 73px 0 58px;
box-sizing: border-box;
min-width: 970px;
max-width: 1920px;
min-height: 700px;
overflow: hidden;
}
.js-on .first .LpFlowPanel{
padding: 73px 20px 58px;
}

/* Box */
.LpFlowPanelWrap.first .LpFlowBox{
background: #e4e7ec;
overflow: hidden;
position: relative;
margin: 0 auto;
width: 100%;
}
.LpFlowPanel .LpFlowBox .LpFlowHdgArea{
padding-top: 67px;
position: relative;
z-index: 2;
position: relative;
display: table;
margin: 0 auto;
font-weight: normal;
color: #424242;
}
.LpFlowPanel .LpFlowBox .LpFlowHdgArea em {
font-size: 2.5em;
font-weight: bold;
color: #1e3c72;
-webkit-mask-image: -webkit-linear-gradient(top, rgba(0,0,0,.7), #000);
position: relative;
}
.js-on .LpFlowPanelWrap.first .PdcImg{
width: 100%;
z-index: 2;
text-align: center;
}
.js-on .LpFlowPanelWrap.first .PdcImg img{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
.js-on .LpFlowPanelWrap.first .PBar {
position: absolute;
z-index: 1;
}
.js-on .LpFlowPanelWrap.first .lBarL{
top: auto;
bottom: 0;
left: 0;
width: 100%;
height: 0;
border-left: 6px solid #0e53a8;
}
.js-on .LpFlowPanelWrap.first .lBarR{
top: 0;
right: 0;
left: auto;
width: 100%;
height: 0;
border-right: 6px solid #0e53a8;
}
.js-on .LpFlowPanelWrap.first .lBarT{
top: 0;
left: 0;
width: 0;
height: 100%;
border-top: 6px solid #0e53a8;
}
.js-on .LpFlowPanelWrap.first .lBarB{
top: auto;
bottom: 0;
left: auto;
right: 0;
width: 0;
height: 100%;
border-bottom: 6px solid #0e53a8;
}
.js-on .LpFlowPanelWrap.first.LpFlowPanelLight .PBar {
border-color: #5ea1d5;
}
.LpLoadBar {
position: relative;
}
.LpLoadBar:before {
content: "";
position: absolute;
width: 100%;
height: 2px;
background: #c6cdd2;
bottom: 40px;
left: 0;
z-index: 0;
}
.first .LpFlowHdgArea.LpLoadBar .BarInner {
position: absolute;
width: 0;
height: 2px;
background: #5ea1d5;
bottom: 40px;
left: 0;
z-index: 1;
}

/* slide2 */
.js-on .LpFlowPanelWrap + .LpFlowPanelWrap{
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.js-on .LpFlowPanelWrap + .LpFlowPanelWrap .LpFlowPanel .LpFlowSlide {
margin: 0 auto;
position: relative;
}
/* LpFlowSlide */
.LpFlowSlide.open > li{
float: left;
list-style: none;
position: relative;
}
.LpFlowSlide > li .slideInner{
width: 100%;
}
.js-on .LpFlowSlide{
display: table;
width: 100%;
overflow: hidden;
}
.js-on .LpFlowSlide li{
list-style: none;
overflow: hidden;
}
.LpFlowSlide li{
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
}
.LpFlowSlide.open li{
border: 0 none;
}
.LpFlowSlide > .str1 .slideInner{
background: #a1d5cf url(../../img/landing_page/fd-r_ws_sr57328/bg1.jpg) right no-repeat;
background-size: auto 100%;
}
.LpFlowSlide > .str2 .slideInner{
background: #7594ba url(../../img/landing_page/fd-r_ws_sr57328/bg2.jpg) no-repeat;
background-size: auto 100%;
text-align: left;
}
.LpFlowSlide > .str3 .slideInner{
background: #b9d1dc url(../../img/landing_page/fd-r_ws_sr57328/bg3.jpg) right no-repeat;
background-size: auto 100%;
}
.LpFlowSlide.open > .str1 .PnlCnt,
.no-script .LpFlowSlide > .str1{
background: #d2e3e1 url(../../img/landing_page/fd-r_ws_sr57328/bg1_l.jpg) no-repeat center center;
}
.LpFlowSlide.open > .str2 .PnlCnt,
.no-script .LpFlowSlide > .str2{
background: #c5cedc url(../../img/landing_page/fd-r_ws_sr57328/bg2_l.jpg) no-repeat center bottom;
background-size: 100%;
}
.LpFlowSlide.open > .str3 .PnlCnt,
.no-script .LpFlowSlide > .str3{
background: #d9e6ec url(../../img/landing_page/fd-r_ws_sr57328/bg3_l.jpg) no-repeat center center;
}
.js-on .PnlCnt{
display: none;
}
.js-on .open .PnlCnt{
display: block;
}
.LpFlowSlide > .str1 > *,
.LpFlowSlide > .str3 > *{
direction : rtl;
}
.LpFlowSlide > .str1 > * > *,
.LpFlowSlide.open > .str1 > *,
.LpFlowSlide > .str3 > * > *,
.LpFlowSlide.open > .str3 > *{
direction : ltr;
}

.js-on .LpFlowSlide > li .slideInner > .LpFlowHdgImg{
width: 50%;
}
.js-on .LpFlowSlide > li.str2 .slideInner > .LpFlowHdgImg{
text-align: left;
}
.js-on .LpFlowSlide.open > li .PnlCnt{
position: absolute;
left: 400px;
top: 0;
text-align: left;
}
.js-on .LpFlowSlide.open > li .PnlCnt img.horizontal{
width: 100%;
}
.js-on .LpFlowSlide.open > li.str1 .PnlCnt img{
position: absolute;
top: 50%;
margin-top: -300px;
height: 100%;
}
.js-on .LpFlowSlide.open > li.str2 .PnlCnt{
text-align: center;
}
.js-on .LpFlowSlide.open > li.str2 .PnlCnt img:first-child{
max-width: 100%;
height: 100%;
}
.js-on .LpFlowSlide.open > li.str2 .PnlCnt img + img{
margin: 50px 0 0 50px;
vertical-align: top;
}
.js-on .LpFlowSlide.open > li.str3 .PnlCntWrap{
position: absolute;
top: 0;
left: 400px;
}
.js-on .LpFlowSlide.open > li.str3 .PnlCnt{
text-align: left;
width: 100%;
display: table-cell;
vertical-align: middle;
position: static;
}
.js-on .LpFlowSlide.open > li.str3 .PnlCnt img{
text-align: left;
}
.LpPnlCntBox{
background: #fff;
display: block;
position: absolute;
right: 11.2%;
width: 156px;
font-size: 1.5em;
text-align: center;
padding: 25px 20px;
font-weight: bold;
box-shadow: 0 0 10px #667880;
}
.LpPnlCntBox:before{
content: '';
position: absolute;
width: 100%;
height: 100%;
border: 1px solid #fff;
top: -3px;
right: -3px;
padding: 2px;
}
.LpPnlCntBox.top{
top: 13%;
}
.LpPnlCntBox.bottom{
bottom: 13%;
margin-bottom: 90px;
}
.LpPnlCntArrw {
width: 196px;
height: 55px;
position: absolute;
padding-bottom: 90px;
background: url(../../img/landing_page/fd-r_ws_sr57328/icon_arrow.png) no-repeat center center;
box-sizing: border-box;
right: 11.2%;
vertical-align: middle;
top: 50%;
margin-top: -86px;
}
.js-on .LpFlowSlide > li .slideInner .LpFlowHdgArea{
padding-left: 50px;
}
.js-on .LpFlowSlide > li.str2 .slideInner .LpFlowHdgArea{
padding-right: 150px;
}
.js-on .LpFlowSlide.open > li .slideInner .LpFlowHdgArea{
padding: 0;
}
.js-on .LpFlowSlide.open > li .slideInner > .LpFlowHdgImg{
display: none;
}

.LpFlowSlide > li .slideInner {
display: table;
position: relative;
table-layout: fixed;
width: 100%;
overflow: hidden;
}
.js-on .LpFlowSlide.open > li .slideInner{
width: 400px;
}
.js-on .LpFlowSlide > li .slideInner > * {
display: table-cell;
vertical-align: middle;
}
.js-on .LpFlowSlide .LpFlowHdgArea .LpFlowClmHdg {
font-size: 0;
text-align: left;
position: static;
}
.js-on .LpFlowSlide.open .LpFlowHdgArea .LpFlowClmHdg {
font-size: 100%;
}
.js-on .LpFlowSlide.open .LpFlowHdgArea .LpFlowClmHdg,
.no-script .LpFlowHdgArea .LpFlowClmHdg{
color : #333;
margin: 0;
font-size: 2.66666em;
margin-bottom: 35px;
font-weight: normal;
line-height: 1.33333;
}
.js-on .LpFlowSlide > li .slideInner > .LpFlowHdgArea img{
position: relative;
z-index: 1;
}
.js-on .LpFlowSlide > li .slideInner > .LpFlowHdgArea img.detailBtn {
display: block;
margin-top: 18px;
opacity: .5;
transition: all .3s;
}
.js-on .LpFlowSlide > li.str2 .slideInner > .LpFlowHdgArea img.detailBtn {
margin-right: 0;
margin-left: auto;
}
.js-on .LpFlowSlide > li.current .slideInner > .LpFlowHdgArea img.detailBtn {
opacity: 1;
}
.js-on .LpFlowSlide li.str2 .LpFlowHdgArea .LpFlowClmHdg,
.js-on .LpFlowSlide > li.str2 .slideInner > .LpFlowHdgArea{
text-align: right;
}
.js-on .LpFlowSlide.open li.str2 .LpFlowHdgArea .LpFlowClmHdg,
.js-on .LpFlowSlide.open > li.str2 .slideInner > .LpFlowHdgArea{
text-align: left;
}
.js-on .LpFlowSlide.open > li .slideInner > .LpFlowHdgArea{
background: #fff;
padding: 0 40px;
width: 400px;
margin-right: auto;
margin-left: 0;
box-sizing: border-box;
}
.js-on .LpFlowSlide.open > li .slideInner > .LpFlowHdgArea .LpFlowClmHdg img{
display: none;
}
.js-on .LpFlowSlide > li .slideInner .LpFlowHdgImg img{
height: 100%;
width: auto;
position: absolute;
top: 0;
left: 0;
}
.js-on .LpFlowSlide > li.str2 .slideInner .LpFlowHdgImg img{
left: auto;
}
.js-on .LpFlowSlide > li .slideInner .LpFlowText{
display: none;
}
.LpFlowSlide > li .slideInner .LpFlowText{
font-size: 1.3333em;
}
.LpFlowSlide.open > li .slideInner .LpFlowText{
display: block;
padding-bottom: 100px;
position: relative;
line-height: 1.625;
}
.js-on .cvBtn{
position: absolute;
left: 0;
bottom: 0;
}
.LpFlowHdgArea button{
padding: 0;
background: none;
border: 0 none;
}
.LpFlowHdgArea .LpFlowClmHdg span{
overflow: hidden;
}
.LpFlowCatalogBtn{
z-idex: 10;
margin: 0 auto;
display: table;
}
.LpFlowCatalogBtn a {
position: absolute;
right: 20px;
top: 20px;
display: table;
}
.LpFlowCatalogBtn a.Ptn01 {
right: 222px;
}
.LpFlowSection a,
.LpFlowSection button{
transition: all 0.4s;
cursor: pointer;
}
.LpFlowSection a:hover,
.LpFlowSection a:focus{
opacity: .6;
}
.open li .slideInner{
position: relative;
z-index: 1;
}
.open .LpFlowHdgArea {
text-align: left;
}
.js-on .LpFlowCLogo{
display: table;
margin: 0 atuo;
text-align: center;
z-index: 1;
width: 100%;
}
.js-on .LpFlowCLogo .inner{
position: absolute;
top: 20px;
width: 100%;
left: 0;
z-index: 10;
vertical-align: middle;
}
.js-on .innertext{
display: none;
}
.innertext{
padding-left: 34px;
}
.LpFlowLargePanel{
background: #fff;
position: absolute;
top: 0;
left: 0;
height: 100%;
z-index: 1;
}
.LpFlowSlide li:first-child + li .LpFlowLargePanel{
left: auto;
right: 0;
}
.js-on .LpFlowSlide > li .LpFlowListBtn{
display: none;
}
.js-on .LpFlowSlide.open > li .LpFlowListBtn{
display: table;
bottom: 40px;
left: 0;
z-index: 2;
position: absolute;
width: 100%;
}
.LpFlowListBtn > li{
display: table-cell;
width: 50%;
text-align: left;
padding: 0 40px;
}
.LpFlowListBtn > li + li{
text-align: right;
}
.LpFlowListBtn button,
.LpFlowListBtn button:disabled{
border: 0 none;
background: #f3f3f3;
border-radius: 25px;
height: 50px;
font-size: 15px;
position: relative;
text-align: left;
z-index: 2;
color: #333;
-moz-focus-inner: none;
outline: none;
}
.LpFlowListBtn button:hover,
.LpFlowListBtn button:focus{
color: #fff;
outline: none;
}
.LpFlowListBtn button.prev{
padding: 2px 19px 2px 60px;
}
.LpFlowListBtn button:before{
content: "";
width: 50px;
height: 50px;
border-radius: 25px;
position: absolute;
top: 0;
right: 0;
transition: all 1s;
z-index: -1;
}
.LpFlowListBtn button.prev:before{
right: auto;
left: 0;
}
.LpFlowListBtn button.next{
text-align: right;
padding: 2px 60px 2px 19px;
}
.LpFlowListBtn button:hover,
.LpFlowListBtn button:focus{
opacity: 1;
}
.LpFlowListBtn button:hover:before,
.LpFlowListBtn button:focus:before{
width :100%;
}

.str3 .LpFlowListBtn button.next:before{
background: #7bb9b9;
}
.str2 .LpFlowListBtn button.next:before{
background: #5588a0;
}
.str1 .LpFlowListBtn button.next:before{
background: #486292;
}

.str1 .LpFlowListBtn button.prev:before{
background: #5588a0;
}
.str2 .LpFlowListBtn button.prev:before{
background: #7bb9b9;
}
.str3 .LpFlowListBtn button.prev:before{
background: #486292;
}

.LpFlowListBtn button:after{
content: "";
width: 50px;
height: 50px;
position: absolute;
top: 0;
left: 3px;
background: url(../../img/landing_page/fd-r_ws_sr57328/icon_prev.png) no-repeat;
}
.LpFlowListBtn button.next:after{
background: url(../../img/landing_page/fd-r_ws_sr57328/icon_next.png) no-repeat;
left: auto;
right: 0;
}
.first .LpFlowHdgArea{
overflow: hidden;
}
.first .LpFlowHdgArea span{
position: relative;
}
.js-on .cvBtn{
display: none;
}
.js-on .LpFlowFooter{
position: relative;
}
.LpFlowFooterList{
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
justify-content: center;
position: absolute;
width: 100%;
text-align: center;
top: -30px;
}
.LpFlowFooterList > li{
margin: 0 0 0 10px;
padding: 0 0 0 10px;
list-style: none;
color: #787878;
border-left: 1px solid #787878;
}
.LpFlowFooterList > li:first-child{
margin: 0;
padding: 0;
border: none;
}
.LpFlowFooterList > li > a{
color: #787878;
}


/* for js off */
.no-script .LpFlowHdgImg,
.no-script .LpFlowListBtn{
display: none;
}
.no-script .LpFlowSlide .LpFlowHdgArea .LpFlowClmHdg img{
display: none;
}
.no-script .LpFlowSlideLi{
display: table;
table-layout: fixed;
width: 100%;
height: 600px;
}
.no-script .PdcImg{
text-align: center;
}
.no-script .LpFlowSlideLi.str2{
direction: rtl;
}
.no-script .LpFlowSlideLi > .slideInner,
.no-script .LpFlowSlideLi > .PnlCnt{
display: table-cell;
vertical-align: middle;
direction: ltr;
}
.no-script .LpFlowSlideLi > .slideInner, .no-script .LpFlowSlideLi.str1 > .PnlCnt{
text-align: left;
}
.no-script .LpFlowSlideLi > .slideInner{
text-align: left;
background: #fff;
width: 30%;
padding: 0 20px;
}
.no-script.LpFlowSection {
min-width: 970px;
max-width: 1350px;
margin: 0 auto;
}
.no-script .cvBtn{
display: block;
margin-top: 30px;
}
.no-script .LpPnlCntBox{
right: 50px;
}
.no-script .LpFlowPanel .LpFlowBox .PdcImg img,
.no-script .LpFlowSlideLi.str1 > .PnlCnt img,
.no-script .LpFlowSlideLi.str3 .PnlCnt img{
width: 100%;
}
.no-script .LpFlowCLogo {
padding: 20px 10px;
}
.no-script .LpFlowCatalogBtn a{
top: 10px;
}
.no-script + .LpFlowFooter{
padding: 10px;
text-align: center;
}
.no-script .LpFlowSlideLi.str1 {
position: relative;
}
.no-script .LpFlowSlideLi.str2 .PnlCnt img {
vertical-align: top;
}
.no-script .LpFlowSlideLi.str2 .PnlCnt img + img {
margin-top:  20px;
margin-left: 20px;
}
.no-script .LpFlowSlideLi.str3 .PnlCntWrap {
padding-top: 15%;
}

.sp .LpFlowLargePanel,
.sp .LpFlowOpenBtn {
display: none;
}
.sp .LpFlowHdgArea .LpFlowClmHdg {
font-size: 2.5em;
}
.sp .LpFlowCatalogBtn a{
top: 15px;
}