

@charset "UTF-8";
/*---------------------------------------------
d
---------------------------------------------*/
body{
    /* background: url(../img_dm/top2.png) no-repeat center; */
    /* background-position-y: 209px; */
    /* background-position-x: 57px; */
    /* background-size: 100%; */
    /* overflow-x: hidden; */
    position:relative;
    /* width: 101vw; */
}
.TODO{
    height:1200px;
    border-top:1px solid #c00;
    padding-top:300px;
    margin-top:300px;
}

a {
  color: #000000;
  text-decoration: none;
  }
  a:hover {
    opacity: 0.8;
    cursor: pointer; }
  a:focus {
    outline: none; }

a:active {
  opacity: 1 !important; }
a:hover {
  transition: all .2s; }
/*---------------------------------------------
style
---------------------------------------------*/
html.tablet,
html.tablet body{
    overflow-x: hidden;
    width:1080px;
}
body.tc{
    font-family: 'Noto Sans TC', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
body.sc{
    font-family: 'Noto Sans SC', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
main{
    font-feature-settings : "palt";
    line-height: 1.7;
}
main p{
    line-height: 1.5;
}
.c-inner{
    width: 960px;
    margin: 0 auto;
    position: relative;
}
.showPC{
  display: block;
}
.showSP,
.-spOnly{
  display: none;
}
.delSP{}
.delOnlySP{}
.c-media__image{
    float: left;
    margin-right: 30px;
}
.c-media__image--right{
    float:right;
    margin-right:0;
    margin-left:30px;
}
.c-media__body{
    overflow: hidden;
}
.c-textBold{
    font-weight: bold;
}
.c-linkBtn{
    display: block;
    border: 2px solid #000;
    border-radius: 50px;
    line-height: 1;
    padding: 10px 0px;
    color: #000;
    background-color: transparent;
    white-space: nowrap;
    position: relative;
    width: 300px;
    text-align: center;
    margin: 0;
    font-size: 14px;
    font-weight: bold;
}
.c-linkBtn:hover{
    display: block;
    border: 2px solid #000;
    border-radius: 50px;
    line-height: 1;
    padding: 10px 0px;
    color: #fff;
    background-color: #000;
    white-space: nowrap;
    position: relative;
    width: 300px;
    text-align: center;
    /* margin: 0; */
    font-size: 14px;
    font-weight: bold;
    opacity: 1;
}
.c-icon_arrow--right{}
.c-icon_arrow--right::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
    border-top: 1px #000 solid;
    border-right: 1px #000 solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -5px;
}
.c-icon_arrow--right:hover::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
    border-top: 1px #fff solid;
    border-right: 1px #fff solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -5px;
    opacity: 1;
}
.c-icon_arrow--more{}
.c-icon_arrow--more::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
/*
    border-top: 1px #000 solid;
    border-right: 1px #000 solid;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
*/
    margin-top: -5px;
}
.c-icon_arrow--more:hover::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
/*
    border-top: 1px #fff solid;
    border-right: 1px #fff solid;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
*/
    margin-top: -5px;
    opacity: 1;
}
.c-icon_arrow--bottom{}
.c-icon_arrow--bottom::before{
    content: "";
    position: absolute;
    right: 10px;
    top: 46%;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
    border-width: 5px 3px 0 3px;
}
.c-icon_arrow--bottom:hover::before{
    content: "";
    position: absolute;
    right: 10px;
    top: 46%;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    border-width: 5px 3px 0 3px;
    opacity: 1;
}
.close{
    position: absolute;
    top: 15px;
    right: 30px;
    z-index: 200;
}
.btnClose{ 
    width: 30px;
    height: 30px;
    color: #fff;
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
}
.btnClose::before,
.btnClose::after{
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: #fff;
    width: 30px;
    height: 0;
    border: 1px solid #fff;
    border-radius: 100px;
}
.btnClose::before{
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
}
.btnClose::after{
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
}
.c-col2{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content:space-between;
    -ms-flex-pack:justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.c-col2 .c-item1{
    width: 50%;
    padding-right: 30px;
}
.c-col2 .c-item2{
    width: 50%;
    padding-left: 30px;
}
.mgt0{margin-top:0!important;}
/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
body{
    font-size:1.4rem;
    overflow-x: hidden;
    box-sizing : border-box;
}
.c-inner{
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    height: 100%;
}
.showPC{
  display: none!important;
}
.showSP,
.-spOnly{
  display: block;
}
.delSP{
    display: none;
}
.delOnlySP{}
.c-media__image{
    float: left;
    margin-right: 30px;
}
.c-media__image--right{
    float:right;
    margin-right:0;
    margin-left:30px;
}
.c-media__body{
    overflow: hidden;
}
.c-linkBtn{
    display: block;
    border: 2px solid #000;
    border-radius: 50px;
    line-height: 1.2;
    padding: 10px 20px 10px 20px;
    color: #000;
    background-color: transparent;
    white-space: inherit;
    position: relative;
    width: 100%;
    text-align: center;
    margin: auto;
    font-size: 14px;
    font-weight: bold;
}
.c-linkBtn:hover{
    display: block;
    border: 2px solid #000;
    border-radius: 50px;
    line-height: 1.2;
    padding: 10px 20px 10px 20px;
    color: #fff;
    background-color: #000;
    white-space: nowrap;
    position: relative;
    width: 100%;
    text-align: center;
    /* margin: 0; */
    font-size: 14px;
    font-weight: bold;
    opacity: 1;
}
.c-icon_arrow--right{}
.c-icon_arrow--right::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
    border-top: 1px #000 solid;
    border-right: 1px #000 solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -5px;
}
.c-icon_arrow--more{}
.c-icon_arrow--more::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    margin: auto;
    display: block;
    width: 7px;
    height: 7px;
/*
    border-top: 1px #000 solid;
    border-right: 1px #000 solid;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
*/
    margin-top: -5px;
}
.c-icon_arrow--bottom{}
.c-icon_arrow--bottom::before{
    content: "";
    position: absolute;
    right: 10px;
    top: 46%;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
    border-width: 5px 3px 0 3px;
}
.close{
    position: fixed;
    top: 15px;
    right: 30px;
    z-index: 200;
}
.btnClose{ 
    width: 30px;
    height: 30px;
    color: #fff;
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
}
.btnClose::before,
.btnClose::after{
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: #fff;
    width: 30px;
    height: 0;
    border: 1px solid #fff;
    border-radius: 100px;
}
.btnClose::before{
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
}
.btnClose::after{
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
}
.c-col2{
    display: inherit;
    display: inherit;
    -webkit-justify-content:inherit;
    justify-content: inherit;
    -webkit-flex-wrap: inherit;
    flex-wrap: inherit;
}
.c-col2 .c-item1{
    width: 100%;
    padding-right: 0;
    margin-bottom: 30px;
}
.c-col2 .c-item2{
    width: 100%;
    padding-left: 0;
}
}
/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
.body-fixed{
    position:fixed;
    width:100%;
    height:100%
    left: 0;
}
.delOnlySP{
    display: none;
}
img{
    max-width: inherit;
    width: 100%;
}
}



/*---------------------------------------------
header
---------------------------------------------*/
.header{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 100px;
    /* border-bottom: 1px solid #ccc; */
}
.header .inner{
    position: relative;
    width: 1260px;
    max-width: 100%;
}
.header.top-header{
    position: fixed;
    -webkit-transition: .2s;
    transition: .2s;
    z-index: 20;
}
.header.top-header.-scroll{
    position: fixed;
    z-index: 100;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    background-color: #fff;
}
.header.top-header.-scroll .logo-wh,
.header.top-header.-scroll .sns .list li a .showPC{
    display: none;
}
.header.top-header.-scroll .logo-or,
.header.top-header.-scroll .sns .list li a .showSP{
    display:block;
}
.header.top-header.-scroll .menu{
    display: block;
}
.header.top-header .menu{
    display: none;
}
.header.detail-header{
    position: fixed;
    z-index: 100;
    background-color: #fff;
}
.header.detail-header.-scroll{
    position: fixed;
    z-index: 100;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.head-wrap{
    padding-top:100px;
}
.header .logo{
    width: 11.25vw;
    position: absolute;
    top: 20px;
    left: 0;
    max-width: 240px;
}
.header .group_logo {
    position: absolute;
    top: 20px;
    right: 0;
    width: 13.125vw;
    max-width: 277px;
}

.header .sns {
    position: absolute;
    top: 36px;
    right: max(31.5vw,38.5%);
}
.header .sns .list{
    
}
.header .sns li{
    float:left;
    margin-left: 5px;
}
.header .sns li a{
    width: 30px;
    height: 30px;
    display: block;
}
.header .sns li a img{
}
.header .language{
    position: absolute;
    top: 32px;
    right: 13.75vw;
    border-radius: 5px;
    border: 1px solid #fff;
    overflow: hidden;
}
.header.detail-header .language,
.header.top-header.-scroll .language{
    border-color:#40A5F5;
}
.header .language .list{
    position: relative;
    display: block;
}
.header .language li{
    float: left;
    /* border: 1px solid #c00; */
}
.header.detail-header .language li,
.header.top-header.-scroll .language li{
    background-color: #40A5F5;
}
.header.top-header.-scroll .language li.language1 {
background-color: #FFF;	
}
.header .language .header-language_switch{
    -webkit-transition: .2s;
    transition: .2s;
    background-color: #fff!important;
}
.language-1 .header-language_switch {
    background-color: #fff;
    width: 50%;
    height: 38px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}

.language-2 .header-language_switch {
    background-color: #fff;
    width: calc(100% / 3);
    height: 38px;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}
.language-3 .header-language_switch {
    background-color: #fff;
    width: calc(100% / 3);
    height: 38px;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}
.header .language .language1{background-color: #FFF;}
.header .language .language2{border-right: 1px solid #FFF; }
.header .language .language3{}
.header .language li a{
    color: #40A5F5;
    line-height: 1;
    padding: 10px 1vw;
    display: block;
    height: 38px;
    overflow: hidden;
    position: relative;
    font-size: max(0.835vw,11px);
}
.header.top-header .language li a:hover{
    background-color: inherit;
    opacity:1;
}
.header .language li.is-active a:hover{
    opacity:1;
    background-color: #40A5F5;
}

.header .language li.is-active a:hover span{
    color:#fff;
}
.header.top-header.-scroll .language li.language1 a:hover span{
    color:#fff;
}
.header .language li.is-active a:hover
.header .language li a span{}
.header .language .language1.is-active a,
.header .language .language2.is-active a,
.header .language .language3.is-active a {
    color:#FFF;
}
.header .language li.language1 a:hover {
    background-color: #40A5F5;	
}
.header .language li.language1 a:hover span {
    color: #FFF;	
}
.header .menu {
    position: relative;
    top: 40px;
    left: 12vw;
}
.header .menu .list{}
.header .menu .list li {
    float: left;
    margin-left: 2%;
    font-size: 1vw;
}
.header .menu .list li a {
    color: #40A5F5;
    line-height: 1;
    font-size: max(0.835vw,11px);
}
.header .menu .list li a::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 0;
}
.header .menu .list li a:hover::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 1;
    -webkit-transition: .2s;
    transition: .2s;
}
.header .menu .list li a.stay{}
.header .menu .list li a.stay:hover{}
.header .menu .list li a.stay::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 1;
}

.global-menu--sp{
    display: none;
}
.menuTrigger_gNav{display: none;}
/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
.header{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 86px;
    /* border-bottom: 1px solid #ccc; */
}
.header .inner{
    position: relative;
}
.header.detail-header{
    position: fixed;
}
.head-wrap{
    padding-top: 86px;
}
.header .logo{
    width: 40%;
    max-width:180px;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 150;
}
.header .group_logo {
    position: absolute;
    top: 20px;
    right: 75px;
    width: 30%;
    max-width:140px;
    z-index: 150;	
}
.header .sns{
    position: relative;
    top: 0;
    right: 0;
    text-align: center;
}
.header .sns .list{
    
}
.header .sns li{
    float: none;
    margin-left: 0;
    display: inline-block;
    margin: 30px 8px;
}
.header .sns li a{
    width: 50px;
    height: 50px;
    display: block;
}
.header .sns li a img{
}
.header .language{
    position: relative;
    top: 0;
    right: 0;
    border-radius: 5px;
    border: 1px solid #fff;
    overflow: hidden;
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    width: calc(100% - 40px);
    margin: auto;
}
.header.top-header .language{
    border: 1px solid #40A5F5;
}
.header.detail-header .language{
    border-color:#40A5F5;
}
.header .language .list{
    position: relative;
    display: block;
}
.header .language li{
    float: left;
	width: calc(100% / 3);
    /* border: 1px solid #c00; */
}
.header.detail-header .language li{
    background-color: #40A5F5;
}
.header .language .header-language_switch{
    -webkit-transition: .2s;
    transition: .2s;
    background-color: #fff!important;
    display: none;
}
.language-1 .header-language_switch {
    background-color: #fff;
    width: 50%;
    height: 38px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}
.language-2 .header-language_switch {
    background-color: #fff;
    width: 50%;
    height: 38px;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}
.language-3 .header-language_switch {
    background-color: #fff;
    width: 50%;
    height: 38px;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    float: none;
}	
.header .language .language1,
.header .language .language2,
.header .language .language3 {
    width: calc(100% / 3);
}

.header .language .language2 {border-right: 1px solid #40A5F5;} 	
	
.header .language li a{
    text-align: center;
    color:#fff;
    line-height: 1;
    padding: 12px 22px;
    display: block;
    font-size: 14px;
    height: 38px;
    overflow: hidden;
    position: relative;
}
.header.top-header .language li a{
    background-color: #40A5F5;
}
.header .language li a:hover{
    opacity:1;
}
.header .language li a span{}
.header .language .language1.is-active a,
.header .language .language2.is-active a,
.header .language .language3.is-active a {
    color:#40A5F5;
    background-color: #fff;
}
.header .menu{
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    width: calc(100% - 40px);
    border-top: 1px solid rgba(0,0,0,.15);
    border-bottom: 1px solid rgba(0,0,0,.15);
    padding: 10px 0;
}
.header .menu .list{}
.header .menu .list li{
    float: none;
    margin-left: 0;
    margin: 10px 0;
}
.header .menu .list li a{
    color: #40A5F5;
    font-size: 20px;
    line-height: 1;
    display: block;
    width: 100%;
    padding: 15px 0;
}
.header .menu .list li a::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 0;
}
.header .menu .list li a:hover::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 1;
    -webkit-transition: .2s;
    transition: .2s;
    display: none;
}
.header .menu .list li a.stay{}
.header .menu .list li a.stay:hover{}
.header .menu .list li a.stay::after{
    content: "";
    height: 3px;
    width: 100%;
    background-color: #40A5F5;
    display: block;
    margin-top: -2px;
    opacity: 1;
    display: none;
}


.-spNavActive .header.top-header .menu{
    display: block;
}
.-spNavActive_bg{
    position: fixed;
    left: 0;
    top: 86px;
    width: 100%;
    height: -moz-calc(100% - 86px);
    height: -webkit-calc(100% - 86px);
    height: calc(100% - 86px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #ffffff;
    overflow-y: scroll;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .2s;
    transition: .2s;
    z-index: 100;
}
.-spNavActive_bg.is-active{
    opacity: 1;
    visibility: visible;
    z-index: 100;
}
.header.top-header .-spNavActive_bg{
    top:0;
    padding-top:86px;
    height: 100%;
}



.l-hdHamburger {
    position: absolute;
    right: 20px;
    top: 25px;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    background-color: transparent;
    outline: none;
    z-index: 150;
}
.header.top-header .l-hdHamburger {
    border-color:#fff;
}
.-spNavActive .header.top-header .l-hdHamburger,
.header.top-header.-scroll .l-hdHamburger{
    border-color:rgba(0, 0, 0, 0.15);
}
.l-hdHamburger .border {
    position: relative;
    display: block;
    width: 100%;
    height: 30px;
    margin: 0;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.l-hdHamburger p {
    font-size: 8px;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
    line-height: 1;
    position: absolute;
    left: 50%;
    bottom: 4px;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    color: #333;
}
.header.top-header .l-hdHamburger p {
    color: #fff;
}
.-spNavActive .header.top-header .l-hdHamburger p,
.header.top-header.-scroll .l-hdHamburger p {
    color: #333;
}
.l-hdHamburger .border span {
    position: absolute;
    left: 50%;
    top: 45%;
    display: block;
    width: 20px;
    height: 2px;
    background: #333;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: .3s;
    transition: .3s;
}
.header.top-header .l-hdHamburger .border span {
    background: #fff;
}
.-spNavActive .header.top-header .l-hdHamburger .border span,
.header.top-header.-scroll .l-hdHamburger .border span {
    background: #333;
}
.l-hdHamburger .border span::before,
.l-hdHamburger .border span::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 20px;
    height: 2px;
    background: #333;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: .3s;
    transition: .3s;
}
.header.top-header .l-hdHamburger .border span::before,
.header.top-header .l-hdHamburger .border span::after {
    background: #fff;
}
.-spNavActive .header.top-header .l-hdHamburger .border span::before,
.-spNavActive .header.top-header .l-hdHamburger .border span::after,
.header.top-header.-scroll .l-hdHamburger .border span::before,
.header.top-header.-scroll .l-hdHamburger .border span::after {
    background: #333;
}
.l-hdHamburger .border span::before {
    margin-top: -5px;
}
.l-hdHamburger .border span::after {
    margin-top: 5px;
}

.-spNavActive .l-hdHamburger .border span {
    width: 0;
}
.-spNavActive .l-hdHamburger .border span::before,
.-spNavActive .l-hdHamburger .border span::after {
    background: #333;
}
.-spNavActive .l-hdHamburger .border span::before {
    -webkit-transform: translate(-50%, -50%) rotate(135deg);
    transform: translate(-50%, -50%) rotate(135deg);
    margin-top: .4px;
}
.-spNavActive .l-hdHamburger .border span::after {
    -webkit-transform: translate(-50%, -50%) rotate(-135deg);
    transform: translate(-50%, -50%) rotate(-135deg);
    margin-top: -.4px;
}


.logo-or{
    opacity: 0;
    display: none;
    transition: .3s;
}
.-spNavActive .logo-or,
.header.top-header.-scroll .logo-or{
    opacity: 1;
    display: block;
}
.logo-wh{
    display: block;
}
.-spNavActive .logo-wh,
.header.top-header.-scroll .logo-wh{
    opacity: 0;
    visibility: hidden;
    display: none;
}




.global-menu--sp{
    display: block;
}
.menuTrigger {
    display: block;
    transition: all .4s;
    width: 30px;
    height: 24px;
    position: absolute;
    left: 10px;
    top: 11px;
    padding: 10px;
    /* line-height: 1; */
    /* font-size: 8px; */
    text-align: center;
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 6px;
    padding: 8px;
    /* position: relative; */
    width: 45px;
    height: 45px;
    /* padding-top: 23px; */
    /* text-align: center; */
    z-index: 101;
}
.menuTrigger span {
    display: block;
    transition: all .4s;
    position: absolute;
    left: 50%;
    width: 16px;
    height: 2px;
    background-color: #000;
    margin-left: -8px;
}
.menuTrigger span:nth-of-type(1) {
    top: 14px;
}
.menuTrigger span:nth-of-type(2) {
    top: 21px;
}
.menuTrigger span:nth-of-type(3) {
    bottom: 13px;
}
.menuTrigger.-isActive span:nth-of-type(1) {
    -webkit-transform: translateY(10px) rotate(-45deg);
    transform: translateY(10px) rotate(-45deg);
    top: 11px;
}
.menuTrigger.-isActive span:nth-of-type(2) {
    opacity: 0;
}
.menuTrigger.-isActive span:nth-of-type(3) {
    -webkit-transform: translateY(-10px) rotate(45deg);
    transform: translateY(-10px) rotate(45deg);
    bottom: 10px;
}
}

.header.top-header.-scroll .group_logo_wh {
    display: none;
}
.header.top-header .group_logo_or {
    display: none;
}
.header.top-header.-scroll .group_logo_or {
    display: block;
}
.-spNavActive .header.top-header .group_logo_or,.header.top-header.-scroll .group_logo_or {
	display: block;
}
/*---------------------------------------------
footer
---------------------------------------------*/
.pagetop{
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 10;
    /*opacity:0;*/
}
.pagetop.fixedF{
    position: fixed;
}
.pagetop a{
    position: relative;
    display: block;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-color: #595757;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    position: relative;
    font-size: 1px;
    text-indent: -9999px;
    /* background: rgba(0, 153, 146,.7); */
}
.pagetop a::before{
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border: 0px;
    /* border-top: solid 2px #ffffff; */
    /* border-right: solid 2px #ffffff; */
    /* -webkit-transform: rotate(-45deg); */
    /* transform: rotate(-45deg) translate(-15%, -50%); */
    position: absolute;
    left: 50%;
    top: 50%;
    margin: auto;
    width: 6px;
    height: 1px;
    background: #fff;
    margin-left: -3px;
    top: 15px;
}
.pagetop a::after{
    content: "";
    position: absolute;
    left:50%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 3px 5px 3px;
    border-color: transparent transparent #ffffff transparent;
    margin-left: -3px;
    top: 19px;
}
.footer{
    /*position: relative;
    background-color: #595757;
    text-align: center;*/
    /* padding: 30px 0; */
    border-top: 1px solid rgba(0,0,0,.3);
    padding: 10px 0 0;
}
.footer .copyright{
    /*text-align: center;
    font-size:12px;
    color: #fff;
    padding: 30px 0;
    display: block;*/
}

#footerCommon {
    margin-right: auto;
    margin-left: auto;
}
#footerCommon .wrap {
    width: 1260px;
    max-width: 100%;
}
.m0a {
    margin-left: auto !important;
    margin-right: auto !important;
}
.wrap {
    width: 1000px;
    padding: 0 20px;
}
.menu-bottom ul {
    margin: 12px 0 0;
    width: 100%;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    padding-bottom: 2em;
}
.menu-bottom li {
    float: left;
    margin: 0 1em 0 1em;
}
.menu-bottom li a {
    color: #595757;
    text-decoration: none;
}
.menu-bottom .bnr-social {
    /*float: right;*/
}
.visible-phone {
    display: none;
}
footer .f_logo  {
    width: 330px;
    display: block;
    max-width: 80%;
    margin: 1em auto;
    clear: both;
}
.copyright {
    clear: both;
    width: 1000px;
    margin: 5px auto 0;
    padding: 0.5em 0 20px;
    font-size: 1.2rem;
    text-align: center;
}
/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
.pagetop{
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 10;
    /*opacity:0;*/
}
.pagetop.fixedF{
    position: fixed;
}
.pagetop a{
    position: relative;
    display: block;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-color: rgba(0,0,0,.8);
}
.pagetop a::before{
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border: 0px;
    /*border-top: solid 2px #ffffff;*/
    /*border-right: solid 2px #ffffff;*/
    /*-webkit-transform: rotate(-45deg);*/
    /*transform: rotate(-45deg) translate(-15%, -50%);*/
    position: absolute;
    left: 50%;
    top: 50%;
    margin: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: auto;
    width: 6px;
    height: 1px;
    background: #fff;
    margin-left: -3px;
    top: 15px;
}
.footer{
    position: relative;
    /*background-color: rgba(0,0,0,.8);*/
    /* background-color: transparent; */
    border-top: 1px solid rgba(0,0,0,.3);
    padding:0 20px;
}
.footer .copyright{
    /*text-align: center;
    font-size:12px;
    padding:30px 20px;*/
}

#footerCommon {
    padding: 0;
}
.menu-bottom {
    width: 100%;
}
.wrap {
    width: auto;
    padding: 0;
}
.menu-bottom ul {
    padding: 10px 0 0;
    width: auto;
    float: none;
}
.menu-bottom li {
    float: none;
    margin: 0;
    padding: 10px 0;
    font-size: 1.56rem;
    text-align: center;
    font-weight: bold;
}
.menu-bottom li a {
    display: block;
}
.bnr-social {
    float: none;
    margin: 10px auto 0;
    text-align: center;
}
.hidden-phone {
    /*display: none !important;*/
}
.copyright {
    width: auto;
    margin: 10px 0 0;
    text-align: center;
}
}



/*---------------------------------------------
top
---------------------------------------------*/
.inner{
    width:1040px;
    margin:auto;
}
.top_main{
    height:808px;
     background: url(../img/top_main_sky.jpg) no-repeat center 100%; 
    background-size: cover;
    text-align: center;
}
.top_main_bg{
    position: absolute;
    top:0;
    left:0;
    right: 0;
    margin:auto;
    height:808px;
    background: url(../img/top_main_shop_2.png) no-repeat center 80%;
    background-size: cover;
    text-align: center;
    z-index: 10;
}
.top_main > .inner{
    padding-top: 110px;
    width:auto;
    position: relative;
}
.top_main_pic01{
    width:520px;
    position: absolute;
    top: 44px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
}
.top_main_pic02{position: absolute;top: 80px;left: 50%;margin-left: -397px;width: 250px;z-index: 1;}
.top_main .text1{
    font-size: 45px;
    color: #FFE600;
    z-index: 5;
    position: absolute;
    top: 110px;
    left: 0;
    right: 0;
    margin: auto;
}
.top_main .text2{
    font-size: 20px;
    color: #51C0F1;
    background: url(../img/top_headtitle_bg.png)no-repeat center center;
    background-size: 100%;
    width: 492px;
    margin: auto;
    z-index: 5;
    position: absolute;
    top: 180px;
    left: 0;
    right: 0;
    margin: auto;
}
.top_main .title{
    font-size: 70px;
    color: #fff;
    line-height: 1.3;
    margin-top: 20px;
    z-index: 5;
    position: absolute;
    top: 230px;
    left: 0;
    right: 0;
    margin: auto;
}
.top_sec1{
    padding: 60px 0;
}
.top_sec1 .text1{
    text-align: center;
    margin-bottom: 60px;
}
.top_nav_wrap{
    position: relative;
    height: 390px;
}
.top_nav_wrap + .top_nav_wrap{
    margin-top:60px;
}
.top_nav_wrap .view-wrap{
    /* overflow: hidden; */
}
.top_nav_pic1{
    background: url(../img/top_pic01_2.jpg) no-repeat center right;
    background-size: cover;
    overflow:hidden;
    height: 390px;
    position: absolute;
    top: 0;
    right: 50%;
    width: 100%;
    border-top-right-radius: 390px;
    border-bottom-right-radius: 390px;
    -webkit-transform: translate(180px, 0%);
    transform: translate(180px, 0%);
    /* display: none; */
}
.top_nav_pic2{
    background: url(../img/top_pic02_2.jpg) no-repeat center right;
    background-size: cover;
    overflow:hidden;
    height: 390px;
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    border-top-left-radius: 390px;
    border-bottom-left-radius: 390px;
    -webkit-transform: translate(-180px, 0%);
    transform: translate(-180px, 0%);
    /* display: none; */
}
.top_nav_maru{
    position: absolute;
    top: 50%;
    right: 50%;
    z-index: 10;
    border: 1px solid #000;
    border-radius: 100px;
    width: 100px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
    background-color: #fff;
    -webkit-transform: translate(220px, -50px);
    transform: translate(220px, -50px);
    line-height: 1;
    padding-top: 22px;
    font-weight: bold;
    font-size: 16px;
}
.top_nav_maru.maru1{border-color: #8163C1;color: #8163C1;}
.top_nav_maru.maru2{border-color: #66BB69;color: #66BB69;-webkit-transform: translate(-220px, -50px);transform: translate(-220px, -50px);right: 0;left: 50%;}
.font-num{
    font-family: "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
    font-size: 40px;
    font-weight: bold;
}
.top_nav_text1{
    position: absolute;
    top:0;
    right: 50%;
    -webkit-transform: translate(520px, 100px);
    transform: translate(520px, 100px);
}
.top_nav_text1 .text{
    color: #8163C1;
    font-size: 32px;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 30px;
}
.top_nav_text2{
    position: absolute;
    top:0;
    left: 50%;
    -webkit-transform: translate(-520px, 120px);
    transform: translate(-520px, 120px);
}
.top_nav_text2 .text{
    color: #66BB69;
    font-size: 32px;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 30px;
}
.btn_top{}
.btn_top .btn{
    text-align: center;
    color: #fff;
    padding: 15px 90px;
    /* border: 1px solid #000; */
    background-color: #8163C1;
    display: block;
    position: relative;
}
.btn_top .btn:hover{
    /* opacity: 1; */
}
.btn_top .btn::before{
    content: "";
    transition: all 0.3s;
    background: #8166bf;
    width: 0%;
    height:100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.btn_top .btn:hover::before{
    background: #a794d2;
    -webkit-animation: gradation 0.2s 1 forwards;
    animation: gradation 0.2s 1 forwards;
}
.btn_top .btn02:hover::before{
    background: #96cf99;
    -webkit-animation: gradation 0.2s 1 forwards;
    animation: gradation 0.2s 1 forwards;
}
@keyframes gradation{
0%{width:0}
100%{width:100%}
}
.btn_top .btn02::before{
    content: "";
    transition: all 0.3s;
    background: #66BB69;
    width: 0%;
    height:100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.btn_top .btn::after{
    content: "";
    background: url(../img/icon_arrow_right.png)no-repeat;
    background-size: cover;
    width: 12px;
    height: 10px;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -5px;
    transition: all 0.3s;
}
.btn_top .btn:hover::after{
    right: 10px;
}
.btn_top .btn.btn02{
    background-color: #66BB69;
}
.top_sec2{
    background-color: #F0FAFE;
    padding:80px 0;
}
.top_sec2 > .inner{}
.top_fig1{
    margin-bottom: 60px;
}
.top_fig1 .textWrap{
    float: right;
    width: 470px;
}
.top_fig1 .textWrap .title{
    font-size: 32px;
    color: #F19D00;
    line-height: 1;
    margin-bottom: 20px;
}
.top_fig1 .textWrap > .text{
    margin-bottom: 52px;
}
.top_fig1 > .pic{
    float: left;
    width: 520px;
}
.top_fig2{
    margin-bottom: 60px;
}
.top_fig2 .textWrap{
    float: left;
    width: 470px;
}
.top_fig2 .textWrap .title{
    font-size: 32px;
    color: #F19D00;
    line-height: 1.4;
    margin-bottom: 20px;
}
.top_fig2 .textWrap .text{}
.top_fig2 > .pic{
    float: right;
    width: 520px;
}
.top_fig3{}
.top_fig3 .list{
    display:-webkit-box;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.top_fig3 .listitem{
    width: 250px;
    float: none;
    margin-left: inherit;
}
.top_fig3 .listitem:first-child,
.top_fig3 .listitem:nth-child(3n+1){
    margin-left: inherit;
}
.top_fig3 .listitem:nth-child(n+4){
    margin-top: 0;
}
.top_fig3 .listitem .title{
    line-height: 1;
    text-align: center;
    padding: 20px 0;
    color: #40A5F5;
    background-color: #E1F5FE;
    margin-bottom: 20px;
}
.top_fig3 .listitem .text{}
.top_fig5{
    margin-top: 80px;
}
.top_fig5 .textWrap{
    float: right;
    width: 480px;
}
.top_fig5 .pic{
    float: left;
    width: 520px;
}
.top_fig5 .textWrap .title{
    font-size: 32px;
    color: #F19D00;
    line-height: 1.4;
    margin-bottom: 20px;
}
.top_fig5 .textWrap .text{}
.top_fig5 .top_fig5__infolist{
    margin-top: 20px;
}
.top_fig5 .top_fig5__infolist .list{
    display: table;
    width: 100%;
}
.top_fig5 .top_fig5__infolist .list + .list{
    margin-top:10px;
}
.top_fig5 .top_fig5__infolist .list dt{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 10px 20px;
    background-color: #E1F5FE;
    width: 110px;
    color: #40A5F5;
    /* border-right: 5px solid #fff; */
}
.top_fig5 .top_fig5__infolist .list dd{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 10px 0px 10px 20px;
    text-align: left;
    /* background-color: #F7F7F7; */
    line-height: 1.4;
}
.top_fig1-2{
    display: table;
}
.top_fig1-2 > .pic{
    display: table-cell;
    width: 200px;
}
.top_fig1-2 > .text{
    display: table-cell;
    vertical-align: bottom;
    padding-left: 10px;
}
.top_sec3{
    padding: 60px 0;
}
.top_sec3 > .inner{}
.top_sec3 .colList{}
.top_sec3 .colList li{
    float: left;
    width: 500px;
}
.top_sec3 .colList li:first-child{}
.top_sec3 .colList li:last-child{
    float: right;
}
.top_sec3 .title{
    font-size: 32px;
    line-height: 1.4;
    margin-bottom: 30px;
}
.top_sec3 .list{
    display: table;
    width: 100%;
}
.top_sec3 .list + .list{
    margin-top:10px;
}
.top_sec3 .list dt,
.top_sec3 .list dd{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 20px 20px;
}
.top_sec3 .list dt{background-color: #E1F5FE;width: 155px;color: #40A5F5;border-right: 5px solid #fff;}
.top_sec3 .list dt span{}
.top_sec3 .list dd{
    text-align: left;
    background-color: #F7F7F7;
    line-height: 1.4;
}
.top_sec3 .list dd span{
    /*display: block;*/
    font-size: 14px;
}
.top_sec3 .list dd span sup{}
.top_sec3 .text{
    font-size:14px;
    margin-top:10px;
}
.top_sec3 .list dd .text1{
    line-height: 1.3;
    margin-bottom: 10px;
}
.top_sec3 .list dd .text1 span{
    font-size: 10px;
}
.top_sec3 .list dd .text2{
    border-top: 1px solid #C9C9C9;
    padding-top: 15px;
    margin-top: 15px;
    line-height: 1.3;
    font-weight: bold;
    margin-bottom: 10px;
}
.top_sec3 .list dd .text2 span{}
.top_sec3 .list dd .text3{
    font-size: 14px;
    margin-bottom: 10px;
}
.top_sec3 .list dd .text3 span{}
.top_sec3 .list dd .text4{
    font-size: 12px;
    line-height: 1.4;
    margin-top: 10px;
}
.top_sec3 .list dd .text4 span{}
.top_sec3 .list dd .text5{
    color:#40A5F5;
    font-weight: bold;
    font-size: 30px;
    letter-spacing: -.03em;
    line-height: 1.2;
}
.top_fig4{
    padding-bottom: 50px!important;
}
.top_bg1{
    position: absolute;
    top: 700px;
    left:50%;
    width: 520px;
    margin-left: 160px;
    z-index: -1;
}
.top_bg2{
    position: absolute;
    top: 1660px;
    left:50%;
    width: 520px;
    margin-left: -590px;
    z-index: -1;
}
.top_bg3{
    position: absolute;
    top: 2110px;
    left:50%;
    width: 346px;
    margin-left: 270px;
    z-index: -1;
}
/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
.inner{
    width: 100%;
    margin:auto;
    padding: 0 20px;
}
.top_main{
    height:666px;
    background: url(../img/top_main_pic_sp2.jpg) no-repeat center center;
    background-size: cover;
    text-align: center;
}
.top_main > .inner{
    padding-top: 116px;
    width:auto;
}
.top_main .text1{
    font-size: 27px;
    color: #FFE600;
    position: relative;
    top: inherit;
    left: inherit;
    right: inherit;
}
.top_main .text2{
    font-size: 14px;
    color: #51C0F1;
    background: url(../img/top_headtitle_bg_sp.png)no-repeat center center;
    background-size: cover;
    margin: 0 20px;
    width: inherit;
    position: relative;
    top: inherit;
    left: inherit;
    right: inherit;
}
.top_main .title{
    font-size: 42px;
    color: #fff;
    line-height: 1.3;
    margin-top: 15px;
    position: inherit;
    top: inherit;
    left: inherit;
    right: inherit;
}
@media screen and (max-width:320px) {
.top_main .text1{
    font-size: 22px;
}
.top_main .text2{
    font-size: 10px;
}
.top_main .title{
    font-size: 32px;
}
}
.top_sec1{
    padding: 40px 0;
}
.top_sec1 .text1{
    text-align: left;
    margin-bottom: 40px;
    padding: 0 20px;
    line-height: 1.7;
}
.top_nav_wrap{
    position: relative;
    height: inherit;
}
.top_nav_wrap + .top_nav_wrap{
    margin-top: 30px;
}
.top_nav_wrap .view-wrap{
    /* overflow: hidden; */
}
.top_nav_pic1{
    background: url(../img/top_pic01_2.jpg) no-repeat center right;
    background-size: cover;
    overflow:hidden;
    height: 160px;
    position: absolute;
    top: 0;
    right: 50%;
    width: 100%;
    border-top-right-radius: 160px;
    border-bottom-right-radius: 160px;
    -webkit-transform: translate(40vw, 0%);
    transform: translate(40vw, 0%);
    /* display: none; */
}
.top_nav_pic2{
    background: url(../img/top_pic02_2.jpg) no-repeat center right;
    background-size: cover;
    overflow:hidden;
    height: 160px;
    position: absolute;
    top: 0;
    left: 0%;
    right: 50%;
    width: 100%;
    border-top-left-radius: 390px;
    border-bottom-left-radius: 390px;
    -webkit-transform: translate(-150px, 0%);
    transform: translate(10vw, 0%);
    /* display: none; */
}
.top_nav_maru{
    position: absolute;
    top: 55px;
    right: 50%;
    z-index: 10;
    border: 1px solid #000;
    border-radius: 100px;
    width: 50px;
    height: 50px;
    text-align: center;
    vertical-align: middle;
    background-color: #fff;
    -webkit-transform: translate(45vw, 0px);
    transform: translate(45vw, 0px);
    line-height: 1;
    padding-top: 9px;
    font-weight: bold;
    font-size: 10px;
}
.top_nav_maru.maru1{border-color: #8163C1;color: #8163C1;}
.top_nav_maru.maru2{border-color: #66BB69;color: #66BB69;-webkit-transform: translate(-45vw, 0px);transform: translate(4vw, 0px);right: 50%;left: 0;}
.font-num{
    font-family: "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
    font-size: 24px;
    font-weight: bold;
}
.top_nav_text1{
    position: relative;
    top: inherit;
    left: inherit;
    right: inherit;
    -webkit-transform: inherit;
    transform: inherit;
    margin: auto;
    padding-top: 180px;
}
.top_nav_text1 .text{
    color: #8163C1;
    font-size: 24px;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 20px;
    text-align: center;
}
.top_nav_text2{
    position: relative;
    top: inherit;
    left: inherit;
    right: inherit;
    -webkit-transform: inherit;
    transform: inherit;
    margin: auto;
    padding-top: 180px;
}
.top_nav_text2 .text{
    color: #66BB69;
    font-size: 32px;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 30px;
    font-size: 24px;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 20px;
    text-align: center;
}
.btn_top{
}
.btn_top .btn{
    text-align: center;
    color: #fff;
    padding: 15px 15px;
    /* border: 1px solid #000; */
    background-color: #8163C1;
    display: block;
    position: relative;
    width: 250px;
    font-size: 16px;
    margin: auto;
}
.btn_top .btn::after{
    content: "";
    background: url(../img/icon_arrow_right.png)no-repeat;
    background-size: cover;
    width: 12px;
    height: 10px;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -5px;
}
.btn_top .btn.btn02{
    background-color: #66BB69;
}
.top_sec2{
    background-color: #F0FAFE;
    padding: 40px 0;
    /* background-color: transparent; */
}
.top_sec2 > .inner{}
.top_fig1{
    margin-bottom: 30px;
}
.top_fig1 .textWrap{
    float: none;
    width: auto;
    margin-bottom: 20px;
}
.top_fig1 .textWrap .title{
    font-size: 24px;
    color: #F19D00;
    line-height: 1;
    margin-bottom: 10px;
}
.top_fig1 .textWrap > .text{
    margin-bottom: 20px;
}
.top_fig1 > .pic{
    float: none;
    width: auto;
}
.top_fig2{
    margin-bottom: 30px;
}
.top_fig2 .textWrap{
    float: none;
    width: auto;
    margin-bottom: 30px;
}
.top_fig2 .textWrap .title{
    font-size: 24px;
    color: #F19D00;
    line-height: 1.4;
    margin-bottom: 20px;
}
.top_fig2 .textWrap .text{}
.top_fig2 > .pic{
    float: none;
    width: auto;
}
.top_fig3{}
.top_fig3 .list{
    display:inherit;
    display:inherit;
    display: block;
    -webkit-box-pack: inherit;
    -ms-flex-pack: inherit;
    justify-content: inherit;
}
.top_fig3 .listitem{
    width: auto;
    float: none;
    margin-left: 0;
    margin-top: 30px;
}
.top_fig3 .listitem:first-child{
    margin-left: 0;
    margin-top: 0;
}
.top_fig3 .listitem:nth-child(n+4){
    margin-top:30px;
}
.top_fig3 .listitem .title{
    line-height: 1;
    text-align: center;
    padding: 15px 0;
    color: #40A5F5;
    background-color: #E1F5FE;
    margin-bottom: 10px;
}
.top_fig3 .listitem .text{}
.top_fig5{
    margin-top: 40px;
}
.top_fig5 .textWrap{
    float: none;
    width: auto;
}
.top_fig5 .pic{
    float: none;
    width: auto;
}
.top_fig5 .textWrap .title{
    font-size: 24px;
    color: #F19D00;
    line-height: 1.4;
    margin-bottom: 20px;
}
.top_fig5 .textWrap .text{}
.top_fig5 .top_fig5__infolist{
    margin-top: 20px;
    margin-bottom: 30px;
}
.top_fig5 .top_fig5__infolist .list{
    display: table;
    width: 100%;
}
.top_fig5 .top_fig5__infolist .list + .list{
    margin-top: 5px;
}
.top_fig5 .top_fig5__infolist .list dt{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 10px 10px;
    background-color: #E1F5FE;
    width: 90px;
    color: #40A5F5;
    /* border-right: 5px solid #fff; */
}
.top_fig5 .top_fig5__infolist .list dd{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 10px 10px;
    text-align: left;
    /* background-color: #F7F7F7; */
    line-height: 1.4;
}
.top_fig1-2{
    display: table;
}
.top_fig1-2 > .pic{
    display: table-cell;
    width: 160px;
}
.top_fig1-2 > .text{
    display: table-cell;
    vertical-align: bottom;
    padding-left: 10px;
}
.top_sec3{
    padding: 30px 0;
}
.top_sec3 > .inner{}
.top_sec3 .colList{}
.top_sec3 .colList li{
    float: none;
    width: auto;
    margin-bottom: 5px;
}
.top_sec3 .colList li:first-child{}
.top_sec3 .colList li:last-child{
    float: none;
}
.top_sec3 .title{
    font-size: 24px;
    line-height: 1.4;
    margin-bottom: 20px;
}
.top_sec3 .list{
    display: table;
    width: 100%;
}
.top_sec3 .list + .list{
    margin-top: 5px;
}
.top_sec3 .list dt,
.top_sec3 .list dd{
    display: table-cell;
    text-align: center;
    vertical-align: top;
    padding: 10px 10px;
}
.top_sec3 .list dt{background-color: #E1F5FE;width: 9em;color: #40A5F5;border-right: 5px solid #fff;}
.top_sec3 .list dt span{}
.top_sec3 .list dd{
    text-align: left;
    /* background-color: #F7F7F7; */
    line-height: 1.4;
}
.top_sec3 .list dd span{
    /*display: block;*/
    font-size: 14px;
}
.top_sec3 .list dd span sup{}
.top_sec3 .text{
    font-size:14px;
    margin-top:10px;
}
.top_sec3 .list dd .text1{
    line-height: 1.3;
    margin-bottom: 10px;
}
.top_sec3 .list dd .text1 span{
    font-size: 10px;
}
.top_sec3 .list dd .text2{
    border-top: 1px solid #C9C9C9;
    padding-top: 15px;
    margin-top: 15px;
    line-height: 1.3;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 13px;
}
.top_sec3 .list dd .text2 span{}
.top_sec3 .list dd .text3{
    font-size: 14px;
    margin-bottom: 10px;
}
.top_sec3 .list dd .text3 span{}
.top_sec3 .list dd .text4{
    font-size: 12px;
    line-height: 1.4;
    margin-top: 10px;
}
.top_sec3 .list dd .text4 span{}
.top_sec3 .list dd .text5{
    color:#40A5F5;
    font-weight: bold;
    font-size: 24px;
    letter-spacing: -.03em;
    line-height: 1.2;
}
.top_fig4{
    padding-bottom: 10px!important;
}
.top_bg1{
    position: absolute;
    top: 550px;
    left:50%;
    width: 520px;
    margin-left: -60px;
    z-index: -1;
    /* display: none; */
}
.top_bg2{
    position: absolute;
    top: 1220px;
    left:50%;
    width: 520px;
    margin-left: -430px;
    z-index: -1;
}
.top_bg3{
    position: absolute;
    top: 2110px;
    left:50%;
    width: 346px;
    margin-left: 270px;
    z-index: -1;
    display: none;
}
}



/*---------------------------------------------
detail
---------------------------------------------*/
.detail-headArea{
    position: relative;
    height: 400px;
    overflow: hidden;
    margin-bottom: 60px;
    /* padding-top: 100px; */
}
.detail-headArea.detail1{
    background-color: #8163C1;
}
.detail-headArea.detail2{
     background-color: #66BB69; 
}
.detail-headArea .detail_head_pic{
    overflow: hidden;
    height: 400px;
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    border-top-left-radius: 400px;
    border-bottom-left-radius: 400px;
    -webkit-transform: translate(-100px, 0%);
    transform: translate(-100px, 0%);
}
.detail-headArea.detail1 .detail_head_pic{
    background: url(../img/p1_head_pic.jpg) no-repeat center right;
    background-size: cover;
}
.detail-headArea.detail2 .detail_head_pic{
    background: url(../img/p2_head_pic.jpg) no-repeat center right;
    background-size: cover;
}
.detail-headArea .bg-pic{
    position: absolute;
    top: -45px;
    left: 50%;
    margin-left: -559px;
    width: 520px;
}
.detail-headArea .bg-pic img{}
.detail_nav_maru{
    /*border: 1px solid #000;*/
    border-radius: 100px;
    width: 100px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
    background-color: #D589E5;
    /* -webkit-transform: translate(220px, -50px); */
    /* transform: translate(220px, -50px); */
    line-height: 1;
    padding-top: 8px;
    font-weight: bold;
    font-size: 16px;
    color: #fff;
}
.detail_nav_maru.maru1{}
.detail_nav_maru.maru2{
    background-color: #d6d661;
}
.detail-headArea .text-wrap{
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -520px;
}
.detail-headArea .text-wrap .headtitle{display: block;width: 100%;}
.detail-headArea .text-wrap .detail_nav_maru{
    display: table-cell;
    vertical-align: middle;
}
.detail-headArea .text-wrap .title2{display: table-cell;vertical-align: middle;font-size: 40px;font-weight: normal;line-height: 1.2;color: #fff;padding-left: 10px;}
.detail-headArea .text-wrap .text{
    margin-top: 30px;
    font-size: 14px;
    color: #fff;
    width: 400px;
}
.d-indexArea{}
.d-indexArea .list{
    text-align: center;
    width: 770px;
    margin: auto;
}
.d-indexArea .list li{
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
}
.d-indexArea .list li dl{
    display: inherit;
    display: inherit;
    display: table;
    -webkit-box-align: inherit;
    -ms-flex-align: inherit;
    align-items: inherit;
}
.d-indexArea .list li dt{
    width: 30px;
    margin-right: 5px;
    display: table-cell;
    vertical-align: middle;
}
.d-indexArea .list li dt img{width: 30px;}
.d-indexArea .list li dd{
    font-size: 12px;
    -webkit-box-flex: inherit;
    -ms-flex: inherit;
    flex: inherit;
    display: table-cell;
    vertical-align: middle;
    padding-left: 5px;
}
.d-sec{
    padding: 80px 0;
}
.d-sec.bg{
    background-color: rgba(182, 167, 216, 0.2);
}
.detail2 .d-sec.bg{
    background-color: rgba(166, 214, 167, .2);
}
.d-secPt1{}
.d-sec > .inner{
    position: relative;
    min-height: 500px;
}
.d-secPt1 .sectionBlock1,
.d-secPt2 .sectionBlock1{
    width: 480px;
}
.d-secPt2 .sectionBlock1{
    float:right;
}
.d-secPt1 .sectionBlock1 .text-wrap,
.d-secPt2 .sectionBlock1 .text-wrap{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 30px;
}
.d-secPt1 .sectionBlock1 .text-wrap .titleNum,
.d-secPt2 .sectionBlock1 .text-wrap .titleNum{
    width: 60px;
    height: 60px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    /* border: 1px solid #c00; */
    line-height: 60px;
    /* padding: 9px 0; */
    background-color: #8163c1;
}
.detail2 .d-secPt1 .sectionBlock1 .text-wrap .titleNum,
.detail2 .d-secPt2 .sectionBlock1 .text-wrap .titleNum{
    background-color: #66bb69;
}
.d-secPt1 .sectionBlock1 .text-wrap .title,
.d-secPt2 .sectionBlock1 .text-wrap .title{
    font-size: 32px;
    color: #8163c1;
    font-weight: normal;
    margin-left: 20px;
    line-height: 1.2;
}
.detail2 .d-secPt1 .sectionBlock1 .text-wrap .title,
.detail2 .d-secPt2 .sectionBlock1 .text-wrap .title{
    color: #66bb69;
}
.d-secPt1 .sectionBlock1 .text,
.d-secPt2 .sectionBlock1 .text{
    line-height: 2;
}
.d-secPt1 .sectionBlock2,
.d-secPt2 .sectionBlock2{
    position: absolute;
    top: 0;
    right: 0;
}
.d-secPt2 .sectionBlock2{
    left:0;
    right:inherit;
}
.d-secPt1 .sectionBlock2 .slideArea,
.d-secPt2 .sectionBlock2 .slideArea{
    width: 520px;
    position: relative;
    overflow: hidden;
}
.slide1_arrow{
    width:100px;
    height:100px;
    position: absolute;
    z-index: 10;
    cursor: pointer;
}
.slide1_arrow:hover{
    opacity: .8;
    transition: all .2s;
}
.slide1_arrow_prev{
    top: 50%;
    left: -45px;
    margin-top: -50px;
}
.slide1_arrow_next{
    top: 50%;
    right: -50px;
    margin-top: -50px;
}
.slider_thumb{
    margin-top:8px;
}
.slider_thumb li{
    width:168px!important;
    cursor: pointer;
    background-color: #fff;
}
.slider_thumb li:hover{
    opacity: .8;
    transition: all .2s;
}
.slider_thumb li:nth-child(1){
    margin-left:0;
}
.slider_thumb li:nth-child(2){
    margin:0 8px;
}
.slider_thumb li:nth-child(3){
    margin-right:0;
}
.slider_thumb .slick-slide img{
    opacity: 0.3;
    transition: all .2s;
}
.slider_thumb .slick-current img{
    opacity: 1;
    transition: all .2s;
}
.d-secFloor{background-color: #fff;}
.d-secFloor-pt2{background-color: #edf7ed;}
.d-secFloor > .inner{width: auto;}
.d-secFloor .title{
    text-align: center;
    font-size: 32px;
    line-height: 1;
}
.d-secFloor .title-pt1{
    color: #8163c1;
}
.d-secFloor .title-pt2{
    color: #66bb69;
}
.slideFloorArea{
    margin-top: 40px;
}
.slideFloor{}
.slideFloor li{
    opacity: .3;
    transition: all .2s;
}
.slideFloor .slick-current{
    opacity:1;
    transition: all .2s;
}
.d-secPt1 .sectionBlock3,
.d-secPt2 .sectionBlock3{
    /* border:1px solid #c00; */
    background-color: #ededed;
    width: 480px;
    margin-top: 30px;
    padding: 30px 20px;
    position: relative;
}
.d-secPt2 .sectionBlock3{
    margin-top:0;
    position: absolute;
    right: 0;
    top: 390px;
}
.d-secPt1 .sectionBlock3 .icon-list,
.d-secPt2 .sectionBlock3 .icon-list{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 20px;
}
.d-secPt1 .sectionBlock3 .icon-list li,
.d-secPt2 .sectionBlock3 .icon-list li{
    width:30px;
    height:30px;
    margin-right: 10px;
}
.d-secPt1 .sectionBlock3 .icon-list img{}
.d-secPt1 .sectionBlock3 .title,
.d-secPt2 .sectionBlock3 .title{
    font-size: 20px;
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 5px;
}
.d-secPt1 .sectionBlock3 .text{
}
.d-secPt1 .sectionBlock3 .textWrap,
.d-secPt2 .sectionBlock3 .textWrap{
    width: 280px;
    float:left;
}
.d-secPt1 .sectionBlock3 .pic,
.d-secPt2 .sectionBlock3 .pic{
    width:140px;
    float:right;
}
.fig1-1{
    position: absolute;
    bottom: -20px;
    right: -29px;
    width: 109px;
    z-index: 10;
}
.fig1-2{
    position: absolute;
    bottom: 140px;
    right: -69px;
    width: 149px;
    z-index: 10;
}
.fig1-2_box .inner{min-height: 600px;}
.d-secPt2.fig1-2_box .sectionBlock3{
    top: 400px;
}
.detail2 .fig1-2_box .inner{min-height: 560px;}
.detail2 .d-secPt2.fig1-2_box .sectionBlock3{
    top: 360px;
}
.fig1-3{
    position: absolute;
    bottom: -44px;
    right: 366px;
    width: 150px;
    z-index: 10;
}
.fig1-4{
    position: absolute;
    bottom: -30px;
    right: -64px;
    width: 105px;
    z-index: 10;
}
.fig1-4_box .inner{min-height: 530px;}
.d-secPt2.fig1-4_box .sectionBlock3{
    top: 330px;
}
.detail2 .fig1-4_box .inner{min-height: 530px;}
.detail2 .d-secPt2.fig1-4_box .sectionBlock3{
    top: 330px;
}
.fig1-1-foot{
    position: absolute;
    bottom: -128px;
    right: -179px;
    z-index: 10;
    width: 150px;
    height:143px;
    background: url(../img/foot1.png) no-repeat;
    background-size: 1354px 143px;
    /*background-position: -1054px 0;*/
}
.fig1-2-foot{
    position: absolute;
    bottom: -138px;
    right: 491px;
    z-index: 10;
    width: 150px;
    height:143px;
    background: url(../img/foot2.png) no-repeat;
    background-size: 1354px 143px;
    /*background-position: -1054px 0;*/
}
.stepanime{
    animation: footstep 1s steps(8) forwards;/*infinite forwards*/
    /*animation: footstep 2.5s ease-in-out .5s forwards;/*infinite forwards*/
}
@keyframes footstep {
  to {
    background-position: -1204px 0;
    /*background-position: -1054px 0;*/
  }
}
.fig2-1{
    position: absolute;
    bottom: -18px;
    left: -40px;
    width: 90px;
    z-index: 10;
}
.fig2-2{
    position: absolute;
    bottom: 160px;
    right: -42px;
    width: 149px;
    z-index: 10;
}
.fig2-3{
    position: absolute;
    bottom: -51px;
    left: -60px;
    width: 140px;
    z-index: 10;
}
.fig2-4{
    position: absolute;
    top: -40px;
    right: -59px;
    width: 135px;
    z-index: 10;
}
.fig2-5{
    position: absolute;
    bottom: -46px;
    right: -24px;
    width: 150px;
    z-index: 10;
}


.detail1_bg1,
.detail2_bg1{
    position: absolute;
    top: 480px;
    left:50%;
    width: 1040px;
    margin-left: -130px;
    z-index: -1;
}
.detail1_bg2,
.detail2_bg2{
    position: absolute;
    top: 1820px;
    left:50%;
    width: 520px;
    margin-left: -590px;
    z-index: -1;
}
.detail1_bg3,
.detail2_bg3{
    position: absolute;
    top: 2090px;
    left:50%;
    width: 347px;
    margin-left: 240px;
    z-index: -1;
}
.detail1_bg4,
.detail2_bg4{
    position: absolute;
    top: 2735px;
    left:50%;
    width: 1040px;
    margin-left: -860px;
    z-index: -1;
}
.detail1_bg5,
.detail2_bg5{
    position: absolute;
    top: 3950px;
    left:50%;
    width: 347px;
    margin-left: 20px;
    z-index: -1;
}

.-isHide {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
    -webkit-transition: opacity 0.7s ease, -webkit-transform 0.7s ease;
    transition: opacity 0.7s ease, -webkit-transform 0.7s ease;
    transition: opacity 0.7s ease, transform 0.7s ease;
    transition: opacity 0.7s ease, transform 0.7s ease, -webkit-transform 0.7s ease;
    -webkit-transition-delay: .35s;
    transition-delay: .35s;
}
.-isShow {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

/*---------------------------------------------------------------------------------------------------------------------------------------
responsiv--------------------------------------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:767px) {
.detail-headArea{
    position: relative;
    height: 445px;
    overflow: hidden;
    margin-bottom: 40px;
}
.detail-headArea.detail1{
    background-color: #8163C1;
}
.detail-headArea.detail2{
     background-color: #66BB69; 
}
.detail-headArea .view-wrap{
    position: relative;
    margin-top: 20px;
    height: 160px;
}
.detail-headArea .detail_head_pic{
    overflow: hidden;
    height: 160px;
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    border-top-left-radius: 160px;
    border-bottom-left-radius: 160px;
    -webkit-transform: translate(-40vw, 0%);
    transform: translate(-40vw, 0%);
}
.detail-headArea.detail1 .detail_head_pic{
    background: url(../img/p1_head_pic.jpg) no-repeat center right;
    background-size: cover;
}
.detail-headArea.detail2 .detail_head_pic{
    background: url(../img/p2_head_pic.jpg) no-repeat center right;
    background-size: cover;
}
.detail-headArea .bg-pic{
    position: absolute;
    top: 21px;
    left: 0;
    margin-left: 0;
    width: auto;
    margin: 0 10px;
}
.detail-headArea .bg-pic img{}
.detail_nav_maru{
    /*border: 1px solid #000;*/
    border-radius: 100px;
    width: 75px;
    height: 75px;
    text-align: center;
    vertical-align: middle;
    background-color: #D589E5;
    /* -webkit-transform: translate(220px, -50px); */
    /* transform: translate(220px, -50px); */
    line-height: 1;
    padding-top: 4px;
    font-weight: bold;
    font-size: 14px;
    color: #fff;
}
.detail_nav_maru.maru1{}
.detail_nav_maru.maru2{
    background-color: #d6d661;
}
.detail-headArea .text-wrap{
    position: relative;
    top: inherit;
    left: inherit;
    margin-left: 0;
    margin: 35px 20px 0;
}
.detail-headArea .text-wrap .headtitle{display: block;width: 100%;}
.detail-headArea .text-wrap .detail_nav_maru{
    display: table-cell;
    vertical-align: middle;
}
.detail-headArea .text-wrap .title2{display: table-cell;vertical-align: middle;font-size: 32px;font-weight: normal;line-height: 1.1;color: #fff;padding-left: 10px;}
.detail-headArea .text-wrap .text{
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.7;
    color: #fff;
    width: auto;
}
.d-indexArea{}
.d-indexArea + .d-sec.d-secPt1{
    margin-top: -50px;
}
.d-indexArea .list{
    padding: 0 20px;
    text-align: left;
    width: auto;
    margin: auto;
}
.d-indexArea .list li{
    display: inline-block;
    margin-right: 8px;
    margin-bottom: 8px;
}
.d-indexArea .list li dl{
    display: -webkit-box;
    display:-ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.d-indexArea .list li dt{
    width: 20px;
    margin-right: 5px;
    display: inherit;
    vertical-align: inherit;
}
.d-indexArea .list li dt img{width: inherit;}
.d-indexArea .list li dd{
    font-size: 12px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 0;
    display: inherit;
    vertical-align: inherit;
}
.d-sec{
    padding: 130px 0 30px;
    padding: 80px 0 80px;
}
.d-sec.bg{
    background-color: rgba(182, 167, 216, 0.2);
}
.detail2 .d-sec.bg{
    background-color: rgba(166, 214, 167, .2);
}
.d-secPt1{}
.d-sec > .inner{
    position: relative;
    min-height: 280px;
}
.d-secPt1 .sectionBlock1,
.d-secPt2 .sectionBlock1{
    width: auto;
}
.d-secPt2 .sectionBlock1{
    float: none;
}
.d-secPt1 .sectionBlock1 .text-wrap,
.d-secPt2 .sectionBlock1 .text-wrap{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 30px;
}
.d-secPt1 .sectionBlock1 .text-wrap .titleNum,
.d-secPt2 .sectionBlock1 .text-wrap .titleNum{
    width: 40px;
    height: 40px;
    text-align: center;
    /* vertical-align: middle; */
    color: #fff;
    /* border: 1px solid #c00; */
    line-height: 40px;
    /* padding: 7px 0; */
    background-color: #8163c1;
}
.detail2 .d-secPt1 .sectionBlock1 .text-wrap .titleNum,
.detail2 .d-secPt2 .sectionBlock1 .text-wrap .titleNum{
    background-color: #66bb69;
}
.d-secPt1 .sectionBlock1 .text-wrap .title,
.d-secPt2 .sectionBlock1 .text-wrap .title{
    font-size: 24px;
    color: #8163c1;
    font-weight: normal;
    margin-left: 10px;
    line-height: 1.2;
}
.detail2 .d-secPt1 .sectionBlock1 .text-wrap .title,
.detail2 .d-secPt2 .sectionBlock1 .text-wrap .title{
    color: #66bb69;
}
.d-secPt1 .sectionBlock1 .text,
.d-secPt2 .sectionBlock1 .text{
    line-height: 2;
}
.d-secPt1 .sectionBlock2,
.d-secPt2 .sectionBlock2{
    position: relative;
    top: inherit;
    right: inherit;
    margin-top: 20px;
}
.d-secPt2 .sectionBlock2{
    left: inherit;
    right:inherit;
    /* margin-bottom: 20px; */
}
.d-secPt1 .sectionBlock2 .slideArea,
.d-secPt2 .sectionBlock2 .slideArea{
    width: auto;
    position: relative;
    overflow: hidden;
}
.slide1_arrow{
    width: 64px;
    height: 64px;
    position: absolute;
    z-index: 10;
    cursor: pointer;
}
.slide1_arrow:hover{
    opacity: .8;
    transition: all .2s;
}
.slide1_arrow_prev{
    top: 50%;
    left: -30px;
    margin-top: -32px;
}
.slide1_arrow_next{
    top: 50%;
    right: -35px;
    margin-top: -32px;
}
.slide2_arrow_prev{
    top: 50%;
    left: -50px;
    margin-top: -32px;
}
.slide2_arrow_next{
    top: 50%;
    right: -55px;
    margin-top: -32px;
}
.slider_thumb{
    margin-top:8px;
}
.slider_thumb li{
    width: -moz-calc((100% - 16px) / 3)!important;
    width: -webkit-calc((100% - 16px) / 3)!important;
    width: calc((100% - 16px) / 3)!important;
    cursor: pointer;
    background-color: #fff;
}
.slider_thumb li:hover{
    opacity: .8;
    transition: all .2s;
}
.slider_thumb li:nth-child(1){
    margin-left:0;
}
.slider_thumb li:nth-child(2){
    margin:0 8px;
    /* margin: 0; */
}
.slider_thumb li:nth-child(3){
    margin-right:0;
}
.slider_thumb .slick-slide img{
    opacity: 0.3;
    transition: all .2s;
}
.slider_thumb .slick-current img{
    opacity: 1;
    transition: all .2s;
}
.d-secFloor{background-color: #fff;padding-top: 80px;}
.d-secFloor-pt2{background-color: #edf7ed;}
.d-secFloor > .inner{width: auto;}
.d-secFloor .title{
    text-align: center;
    font-size: 32px;
    line-height: 1;
}
.d-secFloor .title-pt1{
    color: #8163c1;
}
.d-secFloor .title-pt2{
    color: #66bb69;
}
.slideFloorArea{
    margin-top: 40px;
}
.slideFloor{}
.slideFloor li{
    opacity: .3;
    transition: all .2s;
}
.slideFloor .slick-current{
    opacity:1;
    transition: all .2s;
}
.d-secPt1 .sectionBlock3,
.d-secPt2 .sectionBlock3{
    /* border:1px solid #c00; */
    background-color: #ededed;
    width: 100%;
    margin-top: 30px;
    padding: 30px 20px;
    position: relative;
}
.d-secPt2 .sectionBlock3{
    margin-top: 30px;
    position: relative;
    right: inherit;
    top: inherit;
}
.d-secPt1 .sectionBlock3 .icon-list,
.d-secPt2 .sectionBlock3 .icon-list{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 10px;
}
.d-secPt1 .sectionBlock3 .icon-list li,
.d-secPt2 .sectionBlock3 .icon-list li{
    width:30px;
    height:30px;
    margin-right: 10px;
}
.d-secPt1 .sectionBlock3 .icon-list img{}
.d-secPt1 .sectionBlock3 .title,
.d-secPt2 .sectionBlock3 .title{
    font-size: 18px;
    font-weight: bold;
    line-height: 1;
    margin-bottom: 5px;
    word-break: break-word;
    /* word-wrap: break-word; */
    /* overflow-wrap: break-word; */
}
.d-secPt1 .sectionBlock3 .text{font-size: 16px;}
.d-secPt1 .sectionBlock3 .textWrap,
.d-secPt2 .sectionBlock3 .textWrap{
    width: 100%;
    float: none;
}
.d-secPt1 .sectionBlock3 .pic,
.d-secPt2 .sectionBlock3 .pic{
    width:140px;
    float: none;
    text-align: center;
    margin: auto;
    margin-bottom: 20px;
}
.fig1-1{
    position: absolute;
    bottom: -70px;
    right: -22px;
    width: 120px;
    z-index: 10;
}
.fig1-2{
    position: absolute;
    bottom: -90px;
    right: inherit;
    left: -20px;
    width: 149px;
    z-index: 10;
}
.fig1-2_box .inner{min-height: inherit;}
.d-secPt2.fig1-2_box .sectionBlock3{
    top: inherit;
}
.detail2 .fig1-2_box .inner{min-height: inherit;}
.detail2 .d-secPt2.fig1-2_box .sectionBlock3{
    top: inherit;
}
.fig1-3{
    position: absolute;
    bottom: -74px;
    right: -20px;
    width: 150px;
    z-index: 10;
}
.fig1-4{
    position: absolute;
    bottom: -120px;
    right: inherit;
    left: -20px;
    width: 110px;
    z-index: 10;
}
.fig1-4_box .inner{min-height: inherit;}
.d-secPt2.fig1-4_box .sectionBlock3{
    top: inherit;
}
.detail2 .fig1-4_box .inner{min-height: inherit;}
.detail2 .d-secPt2.fig1-4_box .sectionBlock3{
    top: inherit;
}
.fig1-1-foot{
    position: absolute;
    bottom: -128px;
    right: inherit;
    left: 50%;
    margin-left: -90px;
    z-index: 10;
    width: 150px;
    height:143px;
    background: url(../img/foot1.png) no-repeat;
    background-size: 1354px 143px;
    /*background-position: -1054px 0;*/
}
.fig1-2-foot{
    position: absolute;
    bottom: -133px;
    right: inherit;
    left: 80px;
    z-index: 10;
    width: 150px;
    height:143px;
    background: url(../img/foot2.png) no-repeat;
    background-size: 1354px 143px;
    /*background-position: -1054px 0;*/
}
.stepanime{
    animation: footstep 1s steps(8) forwards;/*infinite forwards*/
    /*animation: footstep 2.5s ease-in-out .5s forwards;/*infinite forwards*/
}
@keyframes footstep {
  to {
    background-position: -1204px 0;
    /*background-position: -1054px 0;*/
  }
}
.fig2-1{
    position: absolute;
    bottom: -68px;
    left: inherit;
    right: -20px;
    width: 90px;
    z-index: 10;
}
.fig2-2{
    position: absolute;
    bottom: -60px;
    right: inherit;
    left: -20px;
    width: 149px;
    z-index: 10;
}
.fig2-3{
    position: absolute;
    bottom: -81px;
    left: inherit;
    right: -15px;
    width: 140px;
    z-index: 10;
}
.fig2-4{
    position: absolute;
    top: inherit;
    bottom: -80px;
    right: inherit;
    left: -20px;
    width: 135px;
    z-index: 10;
}
.fig2-5{
    position: absolute;
    bottom: -76px;
    right: -24px;
    width: 150px;
    z-index: 10;
}


.detail1_bg1,
.detail2_bg1{
    position: absolute;
    top: 480px;
    left:50%;
    width: 1040px;
    margin-left: -130px;
    z-index: -1;
}
.detail1_bg2,
.detail2_bg2{
    position: absolute;
    top: 1820px;
    left:50%;
    width: 520px;
    margin-left: -590px;
    z-index: -1;
}
.detail1_bg3,
.detail2_bg3{
    position: absolute;
    top: 2090px;
    left:50%;
    width: 347px;
    margin-left: 240px;
    z-index: -1;
}
.detail1_bg4,
.detail2_bg4{
    position: absolute;
    top: 2735px;
    left:50%;
    width: 1040px;
    margin-left: -860px;
    z-index: -1;
}
.detail1_bg5,
.detail2_bg5{
    position: absolute;
    top: 3950px;
    left:50%;
    width: 347px;
    margin-left: 20px;
    z-index: -1;
}

.-isHide {
    opacity: 0;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity 0.7s ease, -webkit-transform 0.7s ease;
    transition: opacity 0.7s ease, -webkit-transform 0.7s ease;
    transition: opacity 0.7s ease, transform 0.7s ease;
    transition: opacity 0.7s ease, transform 0.7s ease, -webkit-transform 0.7s ease;
    -webkit-transition-delay: .35s;
    transition-delay: .35s;
}
.-isShow {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
}








  






