/* top */
#index main{margin-bottom:200px;}
#index .sec1 {
    height:100vh;
}
#index .sec1 {
    background-image:url(/images/index/top.svg);
    background-size: 90%;
    background-position: 85% 40%;
}
#index .sec1 .scroll_down{
    position: absolute;
    width: 50px;
    bottom: 10%;
}
#index .sec2 .imgs{
    margin-top:11px;
    width:82%;
}
#index .sec2 .imgs img{
    width:47%;
    border-radius:8px;
    margin-bottom:3%;
}
#index .sec2 .text{
    background-color:rgba(255,255,255,0.9);
    width: 39%;
    padding: 4% 3%;
    top:48%;
    position: absolute;
    display: block;
    left: 50%;
    transform: translate(-50% , -50%);
    opacity:0;
    margin-top:30px;
}
#index .sec2 .text.up{
    opacity:1;
    margin-top:0px;
}
#index .sec2 .text p{
    margin-top:80px;
    font-size:1rem;
}
#index .sec2 .text a{
    margin: 37px auto 0 auto;
    position: relative;
    display: block;
    width: 50%;
    left:auto;
    text-align:center;
    transform:translateY(30px);
}
#index .sec3{
    margin-top:125px;
}
#index .sec3 > div{
    max-width:1050px;
    align-items:center;
    padding:90px 0;
}
#index .sec3 .slider{
    width:59%;
    height: 630px;
}
#index .sec3 .slider .imgs{
    width:85%;
    height:0;
    padding-bottom:63%;
    position:relative;
}
#index .sec3 .slider .imgs a{
    position:absolute;
    width:100%;
    height:auto;
    transition:opacity 0.5s;
    opacity:0;
    bottom:0;
}
#index .sec3 .slider .imgs img{
    width:100%;
    height:auto;
}
/*
#index .sec3 .slider[data-state="1"] .imgs a:nth-child(1){z-index:1;}
#index .sec3 .slider[data-state="2"] .imgs a:nth-child(2){z-index:1;}
#index .sec3 .slider[data-state="3"] .imgs a:nth-child(3){z-index:1;}
#index .sec3 .slider[data-state="4"] .imgs a:nth-child(4){z-index:1;}
*/
#index .sec3 .slider .nav {text-align:center;margin:10px 0 30px 0;}
#index .sec3 .slider .nav span{
    width:14px;
    height:14px;
    display:inline-block;
    background:#0092c6;
    border-radius:10px;
    transition:all .5s;
    margin:0 10px;
    position:relative;
    transform:scale(0.4);
}
#index .sec3 .slider .imgs + div{max-width:70%}
#index .sec3 .slider .nav{width:100%;}
#index .sec3 .slider .prev,
#index .sec3 .slider .next{width:5%;}
#index .sec3 .slider .prev:before,
#index .sec3 .slider .next:before{
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
}
#index .sec3 .slider .prev:before{
    background-image:url(/images/index/prev.svg);
}
#index .sec3 .slider .next:before{
    background-image:url(/images/index/next.svg);
}
#index .sec3 .slider .text{width:90%;position:relative;}
#index .sec3 .slider .text h4{width:100%;text-align:center;}
#index .sec3 .slider .text span{width:100%;text-align:center;}
#index .sec3 .slider .text small{width:100%;text-align:center;}
#index .sec3 .slider .text div a:last-child{margin-top:50px;}
#index .sec3 .slider .text div a:first-child{width:100%;}
#index .sec3 .slider .text > div{position:absolute;top:0;width:100%;opacity:0;z-index:1;transition:opacity 0.5s;}
#index .sec3 .slider .text > div:first-child{position:relative;}

#index .sec3 .slider[data-state="1"] .items > *:nth-of-type(1),
#index .sec3 .slider[data-state="2"] .items > *:nth-of-type(2),
#index .sec3 .slider[data-state="3"] .items > *:nth-of-type(3),
#index .sec3 .slider[data-state="4"] .items > *:nth-of-type(4){
    opacity:1;
    z-index:2;
}
#index .sec3 .slider[data-state="1"] .items > span:nth-of-type(1),
#index .sec3 .slider[data-state="2"] .items > span:nth-of-type(2),
#index .sec3 .slider[data-state="3"] .items > span:nth-of-type(3),
#index .sec3 .slider[data-state="4"] .items > span:nth-of-type(4){
    transform:scale(1);
}
#index .sec3 .slider + .text .items > div {
    opacity:0;
    position:absolute;
    transition:all .5s;
}
#index .sec3 .slider[data-state="1"] + .text .items > div:nth-of-type(1),
#index .sec3 .slider[data-state="2"] + .text .items > div:nth-of-type(2),
#index .sec3 .slider[data-state="3"] + .text .items > div:nth-of-type(3),
#index .sec3 .slider[data-state="4"] + .text .items > div:nth-of-type(4){
    opacity:1;
}


#index .sec3 .text{
    width:35.5%;
}
#index .sec3 .text .title{
    text-align:left!important;
}
#index .sec3 .text .items {    height: 350px;}
#index .sec3 .text > div  span{
    font-size: 1.6rem;
    margin-top: 65px;
    display: block;
}
#index .sec3 .text p{
    font-size:1rem;
    margin-top:21px;
}
#index .sec4 {
    margin-top: 118px;
}
#index .sec4 img{
     width: 91%;
     border-radius:8px;
 }
#index .sec5{
    margin-top:135px;
    background-image:url(/images/index/img6.jpg);
    background-size:cover;
    padding:0;
}
#index .sec6{
    margin-top:180px;
}
#index .sec6 > div{
    width:83%;
}
#index .sec6 > div > div:first-of-type .title{
    margin-top: -0.6rem;
    text-align:left;
}
#index .sec6 > div > div:first-of-type  a{
    margin-top:76px;
}
#index .sec6 > div > div:last-of-type{
    width:74%;
}
#index .sec6 > div > div:last-of-type > a{
    border-top: 1px solid gray;
    padding: 16px 0;
}
#index .sec6 > div > div:last-of-type > a span{transition:opacity 0.5s;}
#index .sec6 > div > div:last-of-type > a:hover span{opacity:0.5;}
#index .sec6 > div > div:last-of-type > a *{
    line-height:1.8rem!important;
    font-weight: 100;
}
#index .sec6 > div > div:last-of-type > a time{
    font-size: 1.1rem;
    width:10%;
    color:#a5a5a5;
    letter-spacing:-0.5px;
}
#index .sec6 > div > div:last-of-type > a small{
    position:relative;
    width:12%;
    color:#66c166;
    font-size: 1.1rem;
}
#index .sec6 > div > div:last-of-type > a.new span:before{
    content:"";
    display:inline-block;
    position:relative;
    background-position:center;
    background-size:contain;
    background-repeat:no-repeat;
    background-image:url("/images/common/new.svg");
    width:40px;
    height:16px;
    margin-right:1rem;
    top: 0.15rem;
}
#index .sec6 > div > div:last-of-type > a span{
    width:72%;
}
#index .sec6 > div > div:last-of-type > a:last-child{
    border-bottom: 1px solid gray;
}

#about main{margin-bottom:240px;}
#about .sec2{
    margin-top:210px;
}
#about .sec2 h2{
    text-align:center;
    font-size:2.5rem;
    font-weight:100;
}
#about .sec2 p{
    text-align: center;
    margin-top: 89px;
    font-size: 1.1rem;
    line-height: 2.5rem;
}
#about .sec3 {
    margin-top:260px;
    padding:0 8%;
}
#about .sec3 h2{
    text-align:left;
}
#about .sec3 .img{
    width:102%;
    height:auto;
    margin-top: 78px;
    border-radius:15px;
    overflow:hidden;
}
#about .sec3 .img img{height:auto;width:100%;}
#about .sec3 .text{
    margin-top:47px;
    padding: 0 11px;
    position:relative;
}
#about .sec3 .text h3{
    font-size:1.5rem;
    line-height:2.9rem;
    margin-bottom: 61px;
}
#about .sec3 .text p{
    width: 48%;
    font-size:1rem;
    text-align:justify;
}
#about .sec3 .text span{
    position:absolute;
    display:block;
    right:0;
    bottom:0;
    font-size:1.05rem;
    line-height:1.9rem;
    letter-spacing: 0.01rem;
}
#about .sec6{
    max-width:990px;
    margin-top:200px;
}

#service.index main{margin-bottom:240px;}
#service.index .sec2{max-width:1040px;}
#service.index .sec2 p{margin-top: 65px;font-size:1rem;}
#service.index .sec2 div{
    width: 100%;
    margin-top: 216px;
    border-radius: 8px;
    overflow: hidden;
}
#service.index .sec2 div img{
    display:block;
    width:100%;
    height:auto;
}
#service.index .sec3{
    max-width:1060px;
    margin-top:175px;
}
#service.index .sec3 > div div:first-of-type {
    padding-top: 16px;
    width:100%;
}
#service.index .sec3 > div div:first-of-type img{
    width:100%;
    height:auto;
}
#service.index .sec3 > div div h3 span{font-size:2rem;}
#service.index .sec3 > div div:nth-of-type(2) {width:100%;}
#service.index .sec3 > div div:nth-of-type(2) img{
    width:90%;
    height:auto;
}
#service.index .sec3 > div div:last-of-type{ width:100%;}
#service.index .sec3 > div div:last-of-type .title{text-align:left;}
#service.index .sec3 > div div:last-of-type p{margin-top: 43px;font-size:1rem;}
#service.index .sec3 > div:nth-of-type(1){margin-bottom: 32px;}
#service.index .sec3 > div:nth-of-type(2){margin-bottom: 101px;}
#service.index .sec3 > div:nth-of-type(3){margin-bottom: 82px;}
#service.index .sec4 {
    max-width: 900px;
}
#service.index .sec4 svg{
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 104px;
}
/*
#service.index .sec4 > a{
    display:block;
    position:absolute;
    background:rgba(0,0,0,0.5);
    width:10%;
    height:10%;
    z-index:100;
}
#service.index .sec4 > a:nth-of-type(1){
    top: -0.5%;
    left:11%;
    width: 27%;
}
#service.index .sec4 > a:nth-of-type(2){
    top: -0.5%;
    width: 35%;
    right:6%;
}
#service.index .sec4 > a:nth-of-type(3){
    bottom: 12%;
    width: 29%;
    right: 0%;
}
#service.index .sec4 > a:nth-of-type(4){
    bottom: 12%;
    width: 29%;
    left: 0%;
}
*/
#service.index .sec5{
   max-width:900px;
}
#service.index .sec5 > div{
    margin-top:104px;
   background-image:url(/images/service/index/figure.svg);
   background-size:contain;
   background-position:center;
   background-repeat:no-repeat;
   height:0;
   padding-bottom:76%;

}
#service.index .sec5 a{
    position:absolute;
    width:30%;
    display:block;
}
#service.index .sec5 a h4{
    margin:1rem 0;
    position:relative;
    display:inline-block;
    left:50%;
    transform:translateX(-50%);
}
#service.index .sec5 a h4:after{right:-16%;}
#service.index .sec5 a span{
    font-size:1.6rem;
}
#service.index .sec5 a small{
    font-size:0.9rem;
    margin-top:0.5rem;
}
#service.index .sec5 a small:before{
    width:3px;
}
#service.index .sec5 a small:after{
    height:3px;
}
#service.index .sec5 a img{
    width:80%;
    height:auto;
    margin:0 auto;
    display:block;
    transition:transform .5s;
}
#service.index .sec5 a:hover img{
    transform:scale(1.15);
}
#service.index .sec5 a:nth-child(1){
    left: 6%;
    top:-3.5%;
}
#service.index .sec5 a:nth-child(2){
    right:9.5%;
    top:-3.5%;
}
#service.index .sec5 a:nth-child(2) h4{margin-bottom:3rem;}
#service.index .sec5 a:nth-child(3){
    bottom:13%;
    left:-1%
}
#service.index .sec5 a:nth-child(4){
    right:2%;
    bottom:13%;
}

#service.template main{margin-bottom:200px;}
#service.template .sec2{
    padding:0 115px;
    margin-top:75px;
    align-items:center;
}
#service.template .sec2 .left{
    width:48%;
}
#service.template .sec2 .left img{
    width:100%;
    max-width:193px;
    height:auto;
}
#service.template .sec2 .left p{
    margin-top:60px;
    font-size:1rem;
}
#service.template .sec2 .left dl{
    margin-top:40px;
}
#service.template .sec2 .left dl dt{
    margin-bottom:10px;
}
#service.template .sec2 .left dl dd{
    font-size:1rem;
    margin-bottom:10px;
}
#service.template .sec2 .left dl + a{margin-top:60px;}
#service.template .sec2 .left .marimo{width:100%;}
#service.template .sec2 .right{
    width:48%;
}
#service.template .sec3{
    padding:0% 6%;
    margin-top:177px;
}
#service.template .sec3 > div {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 80px;
    margin-bottom: 85px;
}
#service.template .sec3 > div:last-of-type{border:none;}
#service.template .sec3 .left{width:50%;}
#service.template .sec3 .left div{width:68%;}
#service.template .sec3 > div:nth-child(n+2) .left div{width:44%;}
#service.template .sec3 .left a{margin-top:58px;}
#service.template .sec3 .left div img{
    width:100%;
    height:auto;
}
#service.template .sec3 .left a img{
    overflow:hidden;
    border-radius:8px;
    display:block;
}

#service.template .sec3 .right{width:48%;}
#service.template .sec3 .right h3{font-size:1.5rem;margin-top:-0.5rem;}
#service.template .sec3 .right p{margin-top: 54px;font-size:1rem;}
#service.template .sec3 .right p > span{
    position:relative;
    display:block;
    margin-top:0px;
}
#service.template .sec3 .right > span{
    display:block;
    margin-top:30px;
    font-size:1rem;
    font-weight:100;
    line-height:1.9em;
}


#service.template .sec4{margin-top:160px;}
#service.template .sec4 div{
    position:relative;
    width:33.3%;
    padding:11% 0;
}
#service.template .sec4 div a {width:100%;}
#service.template .sec4 div a span{
    font-size:1.9rem;
}
#service.marketing .sec3 .left{align-self: center;width:45%;}
#service.marketing .sec3 .right{width:53%;}
#service.marketing .sec3 .left div{width:80%!important;}
#service.marketing .sec3 .right h3{letter-spacing: 0;}
#service.marketing .sec3 .right h3.din_l {
    font-size: 2.2rem!important;
}
#service.marketing .sec3 .right p {margin-top: 40px;}
#service.marketing .sec3 .right h3 small{
    color: #8e8e8e;
    margin-left: 2rem;
    font-size: 0.9rem;
    font-weight: 100;
}
#service.marketing .sec3 .right h3.din_l{font-size:1.5rem;}
#service.marketing .sec3 .right h3 small{margin-left: 0.5rem;}
#service.marketing .sec3 > div {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 50px;
    margin-bottom: 60px;
}

#service.hosting .sec3 .left div{width:70%!important;}
#service.hosting .sec3 .left a{
    margin-top: -0.5em;;
}
#service.hosting .sec3 .left a + a{
    margin-top:58px;
}


#service.global .sec3 .right > span{color:#000028;}

#service.produce .sec2 .left > div{
    width:30%;
}
#service.produce .sec3 h3{
    font-size:1.3rem!important;
    font-weight:100;
    margin-bottom:30px;
    margin-top: -0.5rem!important;
}
#service.produce .sec3 .left a{
    margin-top:10px;
    color:#8e8e8e;
}
#service.produce .sec3 .col2 > *{
    width:48%;
}
#service.produce .sec3 > div{position:relative;}

#service.produce .sec3 .il2 {
    margin: 50px 0px 74px 0;
}

#service.produce .sec3 .il2 a{
    font-size:1rem;
    line-height:1.9em;
}

#service.produce .sec3 .il2 p{margin:0;font-size:1rem;}
#service.produce .sec3 .il2 > h3{width:100%;}
#service.produce .sec3 .il2 span {
    line-height: 1.9rem;
    font-size: 1rem;
    margin-top:0;
    width:100%;
}
#service.produce .sec3 .il2 p a{
}
#service.produce .sec3 .il2 .left,
#service.produce .sec3 .il2 .right{
    width:48%!important;
}
#service.produce .sec3 .right span span:before{
    content:"";
    width:0px;
    height:calc(100% - 1em);
    border-right:1px solid #ececec;
    top:0.8em;
    left:0.6em;
    display:block;
    position:absolute;
    z-index:-1;
}
#service.produce .sec3 .right span span{
    text-indent:0;
    color:#c1c1c1;
    font-size:0.85rem;
    line-height:1.6;
    display:block;
    margin-top:0.6em;
}
#service.produce .sec3 .il {
    position:relative;
    background-color:#f8f8f8;
    padding:30px 25px;
    border-radius:8px;
    margin: 50px 0px 74px 0;
}
#service.produce .sec3 .il:after{
    content:"";
    display:block;
    position:absolute;
    width:0;
    height:45%;
    top:50%;
    left:15%;
    border-right: #ddd solid 1px;
    transform:translateY(-50%);
}
#service.produce .sec3 .il span{
    width:13%;
    font-size:1rem;
    text-align:center;
}
#service.produce .sec3 .il p{
    width:83%;
    font-size:1rem;
}





#company.index main{margin-bottom:200px;}
#company.index .sec2{
    max-width:1040px;
    margin-top:218px;
}
#company.index .sec2 .img{
    width:100%;
    height:auto;
    overflow:hidden;
    border-radius:8px;
    margin-bottom:180px;
}
#company.index .sec2 .img img{
    width:100%;
    height:auto;
}
#company.index .sec2 .title{text-align:left;}
#company.index .sec2 .title span{font-size:2rem;}
#company.index .sec2 .title small{color:#66c166;}
#company.index .sec2 .title small:before,
#company.index .sec2 .title small:after{content:none;}
#company.index .sec2 > div{
    margin-top:46px;
}
#company.index .sec2 div  dl{
    display:flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
#company.index .sec2 > div  dl *{line-height:1.9rem;}
#company.index .sec2 > div > dl{
    padding:30px 0;
    border-bottom:1px solid #9c9c9c;
}
#company.index .sec2 > div > dl > dt{
    width:11%;
    font-size:1rem;
}
#company.index .sec2 > div > dl > dd{
    width: 86.5%;
    font-size:1rem;
}
#company.index .sec2 > div > dl dl{
    padding-bottom:18px;
    margin-bottom:18px;
    border-bottom:1px dotted #acacac;
}
#company.index .sec2 > div > dl dl dt{
    width:25%;
}
#company.index .sec2 > div > dl dl dd{
    width:71%;
}
#company.index .sec2 div  dl a.flex{
    padding: 18px 0 18px 0;
    border-bottom: 1px dotted #acacac;
}
#company.index .sec2 div  dl a.flex.ill:before,
#company.index .sec2 div  dl a.flex.ill:after{
    top:67%;
}
#company.index .sec2 div  dl a.flex span{display:block;}
#company.index .sec2 div  dl a.flex:first-of-type{padding-top:0px;}
#company.index .sec2 div  dl a.flex:last-of-type{border:none;padding-bottom:0;}
#company.index .sec2 div  dl a.flex span:nth-child(1){
    width:25%;
    font-size:1rem;
}
#company.index .sec2 div  dl a.flex span:nth-child(2){
    width: 71%;
    font-size:1rem;
    padding-right:3rem;
}

#company.index .sec2 > div > dl dl:last-of-type{
    border-bottom:none;
    margin-bottom:0;
    padding-bottom:0;
}

#company.index .sec2 > div > dl dl dd span{
    position:relative;
}
#company.index .sec2 > div > dl dl dd span:after{
    content: "";
    width: 100%;
    height: 0;
    border-top: 1px solid #acacac;
    display: inline;
    bottom: 0;
    position: absolute;
    left: 0;
}

#company.index .sec3 {margin-top:180px;max-width:1040px;}
#company.index .sec3 .title{text-align:left;}
#company.index .sec3 .title span{font-size:2rem;}
#company.index .sec3 .title small{color:#66c166;}
#company.index .sec3 .title small:before,
#company.index .sec3 .title small:after{content:none;}
#company.index .sec3 div{
    position:relative;
    margin-top:75px;
}
#company.index .sec3 div:after{
    position: absolute;
    content: "";
    height: 100%;
    width: 0;
    border-right: 1px solid #acacac;
    left: 9.3%;
    top: 0;
    display: block;
}
#company.index .sec3 div dl{
    display:flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom:27px;
}
#company.index .sec3 div dl * {line-height:1.9rem;}
#company.index .sec3 div dt{width:9%;font-size:1.1rem;}
#company.index .sec3 div dd{width:86.5%;font-size:1rem;}


#company.index .sec4 {

}
#company.index .sec4 {margin-top:180px;max-width:1040px;}
#company.index .sec4 .title{text-align:left;}
#company.index .sec4 .title span{font-size:2rem;}
#company.index .sec4 .title small{color:#66c166;}
#company.index .sec4 .title small:before,
#company.index .sec4 .title small:after{content:none;}
#company.index .sec4 > div:last-child{
    width:82%;
    height:0;
    padding-bottom:100%;
    background-image:url(/images/company/index/img1.svg);
    background-size:contain;
}
#company.index .sec5{max-width:950px;margin-top:200px;}
#company #view.anc{top:-150px;}



#company.access{}
#company.access main{
    margin-bottom:200px;
}
#company.access .sec2{margin-top:222px;
    max-width:1027px!important;
}
#company.access .sec2 > div{
    border-bottom:1px solid #9c9c9c;;
    padding-bottom:57px;
   margin-bottom:57px;
}
#company.access .sec2 > div:last-child{border:none;}
#company.access .sec2 > div .left{width:45%%;}
#company.access .sec2 > div .left p{margin-top:18px;font-size:1.1rem;}
#company.access .sec2 > div .left span{display:block;margin-top:30px;line-height:1.9;font-size:1.1rem;;}
#company.access .sec2 > div .right{width:48%;}
#company.access .sec2 > div .right iframe{
    width:100%;
    max-width:494px;
    height:270px;
    border:none;
}


#company.philosophy .sec2{margin-top:220px;}
#company.philosophy h2{width:100%;}
#company.philosophy h2 span{width:100%;text-align:center;}
#company.philosophy h2 small{width:100%;text-align:center;}

#company.philosophy .sec2 > div{margin:73px auto 0 auto;;max-width:1027px;}
#company.philosophy .sec2 > div:before,
#company.philosophy .sec2 > div:after{
    content:"";
    width:0px;
    height:80%;
    border-right:1px solid #ececec;
    top:50%;
    transform:translateY(-50%);
    display:block;
    position:absolute;
}
#company.philosophy .sec2 > div:before{
    left:31.5%;
}
#company.philosophy .sec2 > div:after{
    right:31.5%;
}

#company.philosophy .sec2 > div div{width:28%;position:relative;}
#company.philosophy .sec2 > div div h3{text-align:center;font-size:1.5rem;color:#0092c9;}
#company.philosophy .sec2 > div div img{
    width:100%;
    max-width:206px;
    height:auto;
    position: relative;
    display: block;
    margin-top: 57px;
}

#company.philosophy main{margin-bottom:200px;}
#company.philosophy .sec2 > div div p{font-size:1rem;line-height:1.9em;margin-top: 50px;text-align:justify;}
#company.philosophy .sec3{
    margin-top:100px;
    padding-top:1px;
    padding-bottom:216px;
}
#company.philosophy .sec3 > div{margin-top:120px;max-width:1027px;}
#company.philosophy .sec3 > div .bg{
    margin-top:100px;
    height:0;
    background-image:url(/images/company/philosophy/figure.svg);
    padding-bottom:79%;
    background-size:contain;
}
#company.philosophy .sec4{
    padding-top:1px;
    margin-top:160px;
}
#company.philosophy .sec4 > div{
    max-width:1030px;
}
#company.philosophy .sec4 > div h2{
    text-align: left;
    margin-top: 112px;
}
#company.philosophy .sec4 > div p{
    font-size: 2.6rem;
    line-height: 1.9;
    margin-top: 95px;
    padding-bottom:426px;
}
#company.philosophy .sec4 > div div{
    width: 100%;
    margin-left: 0%;
    margin-top: 12%;
    height: auto;
    position: absolute;
    display: block;
}
#company.philosophy .sec4 > div div img{
    width:100%;
    height:auto;
}
#company.philosophy .sec5 {margin-top:175px;padding:0 7%;}
#company.philosophy .sec5 h2{text-align:left;}
#company.philosophy .sec5 .items > div{width:49%;}
#company.philosophy .sec5 .items > div div{width:73%;}
#company.philosophy .sec5 .items > div div img{
    display:block;
    position:relative;
    width:82%;
    margin:0 auto;
}
#company.philosophy .sec5 .items > div span{
    display:block;
    color:#0092c9;
    text-align:center;
    font-size:1.5rem;
    margin-top:45px;
}
#company.philosophy .sec5 .items > div p{
    text-align:center;
    font-size:1.05rem;
    margin-top:24px;
}
#company.philosophy .sec6{
    max-width:990px;
    margin-top:200px;
}









#rule.index main{
    margin-bottom:200px;
}
#rule.index .sec2{
    margin-top:214px;
    max-width:1024px;
    padding-bottom: 62px;
    border-bottom:1px solid #f3f3f3;
}
#rule.index .sec2 > span{font-size:1rem;line-height:1.9;}
#rule.index .sec2 > div{padding-top:1px;
    counter-reset:c;
}
#rule.index .sec2 > div h2{
    margin-top:30px;
    font-size:1.5rem;
}
#rule.index .sec2 > div > span{
    display: block;
    margin-top: 87px;
}
#rule.index .sec2 > div > div div{
    width:48%;
    margin-top:37px;
}
#rule.index .sec2 > div > div div span{
    display:block;
    line-height:1.9;
    font-size:1rem;
    padding-left:2rem;
    position:relative;
}
#rule.index .sec2 > div > div div span:before{
    counter-increment:c;
    content:  counter(c) ". ";
    position:absolute;
    left:0rem;

}

#rule.index .sec3{
    max-width:1024px;
    padding-bottom: 62px;
    border-bottom:1px solid #f3f3f3;
}
#rule.index .sec3:before{
    content:"";
    width:0px;
    height:62%;
    border-right:1px solid #ececec;
    top:58%;
    left:50%;
    transform:translate(-50%,-50%);
    display:block;
    position:absolute;
}
#rule.index .sec3 > div > div{
    width:48%;
    text-align:justify;
    margin-top:54px;
}
#rule.index .sec3 > div > div h3{
    font-size:1.5rem;
}
#rule.index .sec3 > div > div p{
    margin-top: 54px;
    font-size:1rem;
}

#rule.antisocial main{
    margin-bottom:200px;
}
#rule.antisocial .sec2{
    max-width:1024px;
    margin-top: 218px;
}
#rule.antisocial .sec2 span{
    display:block;
    margin-top:53px;
}
#rule.antisocial .sec2 p{
    margin-top:38px;
    padding-left: 1em;
    text-indent: -1em;
}
#rule.antisocial .sec2 p+p{
    margin-top:0;
}




#sitemap main{margin-bottom:200px;}
#sitemap .sec2{max-width:1027px;margin-top:214px;}
#sitemap .sec2 div{width:22%;margin-bottom:66px;}
#sitemap .sec2 span{
    font-weight:bold;
    font-size:1rem;
    display: block;
    border-bottom: 1px solid #acacac;
    padding-bottom: 20px;
    margin-bottom:13px;
}
#sitemap .sec2 a{
    padding-top:1px;
    margin-top: 4px;
    font-size: 1rem;
    color:#acacac;
}
#sitemap .sec2 .l{width:25%;}
#sitemap .sec2 .dummy{width:45%;}

#recruit.index main{margin-bottom:200px;}
#recruit.index .sec2{
    max-width:1027px;
    margin-top:220px;
}
#recruit.index .sec2 .bg{
    width:100%;
    height:0;
    padding-bottom:41%;
    border-radius:8px;
}
#recruit.index .sec2 > span{
    font-size: 2.5rem;
    margin-top: 170px;
}
#recruit.index .sec2 .flex{
    margin-top:189px;
    width:100%;
}
#recruit.index .sec2 .flex h2{
}
#recruit.index .sec2 .flex p{
    width:74%;
    font-size:1rem;
    margin-top:-0.3rem;
}
#recruit.index .sec3{
    padding-top:1px;
    margin-top:160px;
    padding-bottom:160px;
}
#recruit.index .sec3 h2{
    text-align:center;
    margin-top:127px;
}
#recruit.index .sec3 .flex{
    margin-top:100px;
}
#recruit.index .sec3 > div h5 span + span{
    font-size:1rem;
    color:#0092c9;
}

#recruit.welfare main{
    margin-bottom:200px;
}
#recruit.welfare .sec2{
    padding-top:1px;
}
#recruit.welfare .sec2 > p{
    font-size:2rem;
    margin-top:204px;
    max-width: 1027px;

}
#recruit.welfare .sec2 > div{
    margin-top:135px;
}
#recruit.welfare .sec2 > div:after{
    content:"";
    display:block;
    width:33.3%;
    height:0;
    position:relative;
}


/******************************/
.welfare_anim > div{
    max-width:1027px;
}
.welfare_anim a{
    position:relative;
    width:33.33%;
    padding-bottom:55px;
    transition:all .5s;
}
.welfare_anim a.on{
    transform:translate(-10px,-10px);
    filter: drop-shadow(10px 10px 0 #aaa);
    z-index:1;
}
.welfare_anim a img{
    position:relative;
    left:50%;
    transform:translateX(-50%);
    width:80%;
    margin-top:30px;
}
.welfare_anim  a h2 {width:100%;margin-top:24px;}
.welfare_anim  a h2 span{
    font-size:1.5rem;
    text-align:center;
}
.welfare_anim a h2 small{display:block;text-align:center;}
.welfare_anim a:after{
    content: "";
    display: block;
    position:absolute;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-top: 11px solid #0092c9;
    left:50%;
    transform:translateX(-50%);
    bottom:2%;

}
.welfare_anim article > div{
    max-width:1027px;
    padding:4rem 0;
}
.welfare_anim article .text{width:30%;}
.welfare_anim article .text span{color:#0092c9;font-size:1rem;}
.welfare_anim article .text p{
    font-size:1rem;
    margin-top:2rem;
}
.welfare_anim article .imgs{
    position:relative;
    width:66%;
}
.welfare_anim article .imgs dl {margin-bottom:3%;}
.welfare_anim article .imgs dl dt{
    width:25%;
    font-size:1rem;
}
.welfare_anim article .imgs dl dd{
    width:73%;
    font-size:1rem;

}
.welfare_anim article .imgs img{
    width:48%;
    height:auto;
    display:block;
    overflow:hidden;
    border-radius:8px;
    margin-bottom:3%;
}
.welfare_anim article.drawer{
    transition:all .5s;
    border-width:0px;
    height:0;
    opacity:0;
    position:relative;
}
.welfare_anim article.drawer.on{
    opacity:1;
    border-width:1px;
}
.welfare_anim .drawer > p{
    position:absolute;
    max-width:1027px;
    width:100%;
    height:100%;
    left:50%;
    transform:translateX(-50%);
}
.welfare_anim .next,
.welfare_anim .prev{
    width:20px;
    height:20px;
    position:absolute;
    display:block;
    top:50%;
    transform:translateX(-50%);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition:opacity 0.5s;
}
.welfare_anim .next.off,
.welfare_anim .prev.off{opacity:0.1;}

.welfare_anim .next{
    background-image:url(/images/index/next.svg);
    right:-40px;
}
.welfare_anim .prev{
    background-image:url(/images/index/prev.svg);
    left:-40px;
}


.welfare_anim .virtual_height{height:0;overflow:hidden;}
.welfare_anim .virtual_height > div{height:1000px;}








































#recruit.skill main{margin-bottom:200px;}
#recruit.skill .sec2 {max-width:1027px;}
#recruit.skill .sec2 h2{
    margin-top:208px;
    line-height:1.5em;
    font-size:2.5rem;
}
#recruit.skill .sec2 .imgs{
    position:relative;
    margin-top:100px;
    border-radius:8px;
    width:100%;
}
#recruit.skill .sec2 .imgs > div{
    display:block;
    width:50%;
    height:0;
    padding-bottom:41%;
}
#recruit.skill .sec2 p{
    margin-top:115px;
    font-size:1rem;
    width:100%;
    max-width:750px;
    text-align:justify;
}
#recruit.skill .sec3 {
    max-width:1027px;
    margin-top:196px;
}
#recruit.skill .sec3 h2{
    text-indent: -3.5rem;
    padding-left: 3.5rem;
}
#recruit.skill .sec3 h2 small{
    display: inline-block;
    width: 2.5rem;
    height: 0;
    padding: 1.2rem 0;
    line-height: 0;
    color: white;
    font-size: 1.5rem;
    margin-left: 0;
    margin-right: 1rem;
    border-radius: 8px;
    background: #0092c9;
    text-align: center;
    text-indent: 0;
}

#recruit.skill .sec3 .text{
    width:48%;
}
#recruit.skill .sec3 .text > span{
    color:#66c166;
    margin-top: 69px;
    display: inline-block;
    font-size: 1.3rem;
    line-height: 1.9em;
}
#recruit.skill .sec3 .text > p{
    font-size:1rem;
    margin-top:37px;
}
#recruit.skill .sec3 .text > small{
    font-size:1.3rem;
    display:block;
    margin-top:74px;
    margin-bottom:-52px;
}
#recruit.skill .sec3 .img{
    width:48%;
}
#recruit.skill .sec3 .img img{
    width:100%;
    height:auto;
}
#recruit.skill .sec3 > div{margin-bottom:160px;}
#recruit.skill .sec3 > div:nth-child(even){
    flex-direction:row-reverse;
}
#recruit.skill .sec3 .list{
    margin-top:30px;
}
#recruit.skill .sec3 .list > div{
    width:46%;
}
#recruit.skill .sec3 .list > div span{
    display:block;
    margin-bottom:0.5rem;
    font-weight:1rem;
}
#recruit.skill .sec3 a{
    font-size:1rem;
    margin-top:50px;
    display:inline-block;
    width:100%;
}
#recruit.skill .sec3 a + a{
    margin-top:20px;

}
#recruit.skill .sec4{
    padding-top:1px;
    padding-top:65px;
    padding-bottom:65px;
}
#recruit.skill .sec4 h3{
    margin-top:10px;
    text-align:center;
    font-size:1.4rem;
    color:#0092c9;
}
#recruit.skill .sec4 > div{
    max-width:380px;
    margin-top:75px;
}
#recruit.skill .sec4 > div > a{
    width:48%;
    font-size: 1rem;
    padding: 0.4rem 0rem;
}

#recruit.programmer main{margin-bottom:200px;}
#recruit.programmer .sec2,
#recruit.programmer .sec3{
    max-width:1027px;
}
#recruit.programmer dl{
    display:flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    border-top:1px solid gray;
}
#recruit.programmer .sec2{
    margin-top:212px;
}
#recruit.programmer .sec3{
    margin-top:150px;
    border-bottom:1px solid gray;
}
#recruit.programmer section h2{margin-bottom:1.6em;font-size:1.5rem;}
#recruit.programmer .seu > div{margin-top:39px;}
#recruit.programmer .sec2 > div {}
#recruit.programmer dl{padding: 3rem 0 2.5rem 0;}
#recruit.programmer dl dl{border-top:1px dotted gray;}
#recruit.programmer dl dl:first-child{padding: 0 0 2.5rem 0;border-top:0;}
#recruit.programmer dt,
#recruit.programmer dd{font-size:1rem;}

#recruit.programmer dl.il{border-top:1px dotted gray;}
#recruit.programmer dl.il dt{color:#66c166;}

#recruit.programmer dt{width:25%;line-height:1.9em;}

#recruit.programmer dd{width:74%;line-height:1.9em;}
#recruit.programmer dd span{display:block;line-height:1.9em;}
#recruit.programmer dd span:before{
    position: relative;
    content: "";
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 1rem;
    top: 0.1rem;
    border: 1px solid black;
    margin-right: 1rem;
}
#recruit.programmer dd span.on:before{background:#0092c9;}
#recruit.programmer dd p{
    padding:1rem 0;
    border-bottom:1px dotted gray;
}
#recruit.programmer dd p:first-child{padding-top:0;}
#recruit.programmer dd p:last-child{border:none;}
#recruit.programmer .sec2 div + a,
#recruit.programmer .sec2 dl + a{
    max-width:630px;
    margin-top:100px;
}
#recruit.programmer .sec4{
    max-width:1027px;
    margin-top:130px;
}
#recruit.programmer .sec4 > a{
    width:50%;
    padding:6rem 0;
    text-align:center;
}
#recruit.gra dl{
        padding: 1rem 0 1rem 0;
}
#recruit.gra dl dd p:last-child{
    padding-bottom:0;
}


#recruit.interview main{margin-bottom:200px;}
#recruit.interview .sec2{
    max-width:1027px;
}
#recruit.interview .sec2 > h2{
    margin-top: 210px;
    font-size: 2.5rem;
}
#recruit.interview .sec2 > h3{
    margin-top:186px;
}
#recruit.interview .sec2 > h3 span{
    font-size:1.5rem;
    display:block;
    font-weight:bold;
}
#recruit.interview .sec2 > h3 small{
    font-size:1rem;
    color:#0092c9;
    display:block;
    margin-top:10px;
}
#recruit.interview .sec2 > .bg{
    height:0;
    width:100%;
    padding-bottom:40%;
    margin-top:85px;
    border-radius:8px;
}

#recruit.interview .sec2 .text {
    padding-top:1px;
    counter-reset:c;
    margin-top:80px;
}





#recruit.interview .sec2 .text > div {
    width:100%;
}
#recruit.interview .sec2 .text > div:nth-child(even) {
    margin-bottom:20px;
}
#recruit.interview .sec2 .text > div > *{
    width:48%;
    margin-top:110px;
}
#recruit.interview .sec2 .text > div h4{
    font-size: 1.5rem;
        text-indent: -3.5rem;
    padding-left: 3.5rem;
    letter-spacing:0;
}
#recruit.interview .sec2 .text > div h4:before{
    font-family: 'DIN Next LT W01 Regular';
    counter-increment:c;
    content: "Q" counter(c);
    background-color:#66c166;
    display: inline-block;
    width: 2.5rem;
    height: 0;
    padding: 1.2rem 0;
    line-height: 0;
    color: white;
    font-size: 1.5rem;
    margin-left: 0;
    margin-right: 1rem;
    border-radius: 8px;
    text-align: center;
    text-indent:0;
    letter-spacing:0;
}
#recruit.interview .sec2 .text > div p{
    margin-top:40px;
    font-size:1rem;
}








#recruit.interview .sec3 {margin-top:200px;}
#recruit.interview .sec3 > div{
    width:33.33%;
    transition:all .5s;
}
#recruit.interview .sec3 > div:hover{
    transform:translate(-10px,-10px);
    filter: drop-shadow(10px 10px 0 #aaa);
    z-index:1;
}
#recruit.interview .sec3 > div a{display:block;width:100%;height:100%;padding-bottom:45px;}
#recruit.interview .sec3 > div .bg{
    width:100%;
    height:0;
    padding-bottom:66%;
    border-radius:8px;
}
#recruit.interview .sec3 > div h5{
    position:relative;
    display:block;
    width:90%;
    left:50%;
    transform:translateX(-50%);
    margin-top:60px;
}
#recruit.interview .sec3 > div h5 span{
    font-size:1.5rem;
    display:block;
}
#recruit.interview .sec3 > div h5 small{
    color:#0092c9;
    display:block;
    margin-top: 20px;
    font-size: 1rem;
}
#recruit.meeting main{
    margin-bottom:200px;
}
#recruit.meeting .sec2{
    max-width:1027px;
    margin-top:100px;
}
#recruit.meeting .sec2 .img{margin-top:127px;}
#recruit.meeting .sec2 .img img{width:100%;height:auto;}
#recruit.meeting .sec2 h2{
    margin-top: 160px;
    font-size: 2.5rem;
}
#recruit.meeting .sec2 > p{
    margin-top:100px;
    margin-top: 33px;
    font-size: 1rem;
    max-width:675px;
}
#recruit.meeting .sec2  h3{
    margin-top: 217px;
    font-size: 1.5rem;
    text-align:center;
    width:100%;
}
#recruit.meeting .sec2  .items {margin-top:117px;}
#recruit.meeting .sec2 .items > div{ width:48%;    margin-bottom: 1.7rem;}
#recruit.meeting .sec2 .items > div .p{width:46%;position:relative;border-radius:8px;overflow:hidden;}
#recruit.meeting .sec2 .items > div .p img{width:100%;height:auto;}
#recruit.meeting .sec2 .items > div .p span{
    color:white;
    background-color:#66c166;
    position:absolute;
    bottom:0;
    left:0;
    text-align:center;
    width:100%;
    border-radius:8px;
    border:solid 1px black;
    font-size: 1rem;
    line-height: 2.4rem;
}

#recruit.meeting .sec2 .items > div div:not(.p){
    width:48%;
}
#recruit.meeting .sec2 .items > div div:not(.p) span{display:block;font-size: 1.5rem;margin-top:-0.5rem;}
#recruit.meeting .sec2 .items > div div:not(.p) span.prog:before{
    content: "司会進行";
    display: inline-block;
    color: white;
    background: #0092c9;
    border: solid black 1px;
    font-size: 0.7rem;
    line-height: 1.5rem;
    position: relative;
    top: -0.2rem;
    padding: 0 0.9em;
    margin-right: 0.7rem;
}
#recruit.meeting .sec2 .items > div div:not(.p) span small{
    font-size: 0.8rem;
    color: #aaa;
}
#recruit.meeting .sec2 .items > div div:not(.p) > small{
    font-size: 1.05rem;
    color:#0092c9;
        margin-top: 1.6rem;
    display: block;
    font-size: 1rem;
}
#recruit.meeting .sec2 .items > div div:not(.p) > p{
    margin-top: 1rem;
    font-size: 1rem;
}
#recruit.meeting .talks{width:100%;padding-top:165px;}
#recruit.meeting .talks h4{width:95%;max-width:1027px;font-size:1.5rem;margin-bottom:89px;padding-left:6rem;}
#recruit.meeting .talks h4:before{
    content:"";
    position:absolute;
    display:inline-block;
    left:0;
    width:5rem;
    height:5rem;
    background-image:url(/images/recruit/meeting/t1.png);
    background-size:contain;
    background-repeat:no-repeat;
    top:-40%;
}
#recruit.meeting .talks > div{width:95%;max-width:1027px;}
#recruit.meeting .talks > div > div{width:48%;margin-bottom:4.4rem;}
#recruit.meeting .talks > div p{
    margin-bottom:5rem;
    font-size:1rem;
    line-height: 1.9rem;
}
#recruit.meeting .talks > div img{
    width:100%;
    height:auto;
    display:block;
    margin-bottom:5rem;
    border-radius:8px;
    position:relative;
}
#recruit.meeting .talks  p:before{
    content:"";
    position:relative;;
    display:inline-block;
    left:0;
    width:5rem;
    height:5rem;
    background-size:contain;
    background-repeat:no-repeat;
    float:left;
    margin-right:1rem;
    margin-top:0.5rem;
}
#recruit.meeting .talks  .kiriyama:before{background-image:url(/images/recruit/meeting/t2.png);}
#recruit.meeting .talks  .shirakawa:before{background-image:url(/images/recruit/meeting/t3.png);}
#recruit.meeting .talks  .hagiwara:before{background-image:url(/images/recruit/meeting/t4.png);}
#recruit.meeting .talks  .takizawa:before{background-image:url(/images/recruit/meeting/t5.png);}
#recruit.meeting .talks  .nakamura:before{background-image:url(/images/recruit/meeting/t6.png);}
#recruit.meeting .talks > div p:after{
    content:"";
    display:block;
    width:0;
    height:0;
    clear:both;
}
#recruit.meeting .talks > div p{
    position:relative;
}

#recruit.meeting .talks > div p{

}



#recruit.meeting .sec4{
    margin-top:-32px;
    padding-top:100px;
}
#recruit.meeting .sec4 > div > div{
    margin-bottom:0;
}



#recruit.meeting .sec5 + div{
   max-width:1027px;
   margin-top:138px;
}
#recruit.meeting .sec5 + div img{
    border-radius:8px;
    width:100%;
    height:auto;
}
#recruit.meeting .sec7{
    padding-top: 103px;
}
#recruit.meeting .sec9 {
    padding-top:0;
}
#recruit.meeting .sec8 h4{margin-bottom:40px;}
#recruit.meeting .sec8 > span{
    display:block;
    max-width:1027px;
    margin-bottom:89px;
    color:#0092c9;
}








html.en main *{font-family: 'DIN Next LT W01 Light' , sans-serif;}
#en.index .sec1{height:240px;}
#en.index main{margin-bottom:200px;}
#en.index .sec2{max-width:1027px;}
#en.index .bg{
    background-image:url(/images/en/img1.jpg);
    padding-bottom:41%;
    width:100%;
    height:0px;
    border-radius:8px;
    overflow:hidden;

}
#en.index .sec2 p{margin-top: 65px;}
#en.index .sec2 {
    width: 100%;
    margin-top: 94px;
    border-radius: 8px;
    overflow: hidden;
}
#en.index .sec2 div img{
    display:block;
    width:100%;
    height:auto;
}
#en.index .sec2 > span{
    display: block;
    margin-top: 178px;
    font-size: 2.2rem;
}
#en.index .sec2 > p:first-of-type{
    font-size:1.1rem;
    margin-top:78px;
    line-height:1.76em;
    max-width:630px;
}
#en.index .sec3{max-width:1027px;margin-top:235px;}
#en.index .sec3 h2{font-size: 3rem;margin-bottom:91px;}
#en.index .sec3 h3{font-size: 1.55rem;margin-top:12px;}
#en.index .sec3 h3 + p{font-size:1.1rem;margin-top:28px;line-height:1.76em;}
#en.index .sec3 h3 + p + p{font-size:1.15rem;margin-top:28px;line-height:1.74em;color:#0092c9;}
#en.index .sec3 p + a{left:0;transform:none;margin-top:40px;}
#en.index .sec3 > div > div:first-of-type {padding-top: 16px;width:17%;}
#en.index .sec3 > div > div:first-of-type img{width:100%; height:auto;}
#en.index .sec3 > div > div:nth-of-type(2) {width:29%;    align-self: center;}
#en.index .sec3 > div > div:nth-of-type(2) img{width:90%;height:auto;}
#en.index .sec3 > div > div:last-of-type{ width:48%;}
#en.index .sec3 > div > div:last-of-type .title{text-align:left;}
#en.index .sec3 > div:nth-of-type(1){margin-bottom: 84px;}
#en.index .sec3 > div:nth-of-type(2){margin-bottom: 75px;}
#en.index .sec3 > div:nth-of-type(3){margin-bottom: 95px;}
#en.index .sec4{max-width:1027px;margin-top:186px;}
#en.index .sec4 > div{border-top:1px solid gray;}
#en.index .sec4 > div:last-of-type{border-bottom:1px solid gray;}
#en.index .sec4 > div > div:first-of-type{width:40%;padding:54px 0 80px 0;}
#en.index .sec4 > div > div:first-of-type p{font-size:1.5rem;color:#0092c9;line-height: 2.2rem;}
#en.index .sec4 > div > div:first-of-type a{left:0;transform:none;margin-top:31px;}
#en.index .sec4 > div > div:last-of-type{width:53%;position:relative;}
#en.index .sec4 > div > div:last-of-type img{max-width:307px;}

#company.en .heading{height:160px;}
#company.en .sec2{margin-top:0;}
#company.en .sec2 > div > dl > dt {
    width: 20%;
    font-size: 1rem;
}
#company.en .sec2 > div > dl > dd {
    width: 70%;
    font-size: 1rem;
}
#company.en .sec2 > div > dl > dd > a{
padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px dotted #acacac;
}
#company.en .sec2 > div > dl > dd > a:last-child{
    border:none;
    padding-bottom:0;
    margin-bottom:0;
}
#company.en .sec3 div dl {
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom:15px;
    padding-bottom:15px;
    border-bottom: 1px dotted #acacac;
}
#company.en .sec3 div:after {
    content: none;
}


#company.en .sec3 > a{margin-top: 200px;}


#news main{margin-bottom:200px;}
#news .sec2{margin-top:100px;margin-top:67px;max-width:1027px;}
#news .sec2 > div{max-width:375px;}
#news .sec2 > div > span{max-width:35%;}
#news .sec2 > div p{max-width:65%;}
#news .sec2 > div p .marimo{width:45%;display:inline-block;}
#news .sec2 > div p .marimo a{display:inline;transition:opacity 0.5s;}
#news .sec2 > div p .marimo a:hover{opacity:0.5;}


#news .sec3{max-width:1027px;margin-top:133px;}
#news .sec3 > div{width:100%;}
#news .sec3 .archive{width:11.5%;}
#news .sec3 .archive a{
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    font-size:1.05rem;
    color:#b9b9b9;
    margin-bottom:0.4rem;
}
#news .sec3 .archive a:nth-of-type(n + 6){display:none;}
#news .sec3 .archive > a.current{
    color: #000028;
}
#news .sec3 .archive > span{
    display:block;
    margin-top:30px;
    cursor:pointer;
}
#news .sec3 .archive > span a{
    position:relative;
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    color:#b9b9b9;
    font-size:1.1rem;
    display:inline-block;
}
#news .sec3 .archive > span a:after{
    content: "";
    display:inline-block;
    position:absolute;
    width: 0;
    height: 0;
    top:20%;
    margin-left:0.5rem;
    border: 5px solid transparent;
    border-top: 11px solid #b9b9b9;
    transition:all .5s;
}
#news .sec3 .archive > span a.on:after{
    content: "";
    display:inline-block;
    position:absolute;
    width: 0;
    height: 0;
    top:-2%;
    margin-left:0.5rem;
    border: 5px solid transparent;
    border-bottom: 11px solid #b9b9b9;
    transition:all .5s;
}


#news .sec3 .items{width:87%;justify-content:start;}
#news .sec3 .items > a{width:33.3%;padding:2% 2% 4% 2%;}
#news .sec3 .items > a > div{width:100%;}
#news .sec3 .items > a > div .bg{
    position:relative;;
    background-color:rgba(0,0,0,0.4);
    height:0;
    width:100%;
    padding-bottom:66%;
    border-radius:8px;
}
#news .sec3 .items > a.new > div .bg:before{
    content:"";
    display:block;
    position:absolute;
    left:3%;
    top:5%;
    background-position:center;
    background-size:contain;
    background-repeat:no-repeat;
    background-image:url("/images/common/new.svg");
    width:40px;
    height:16px;
}

#news .sec3 .items > a div span{margin-top:25px;display:block;}
#news .sec3 .items > a div span time{font-size:1rem;}
#news .sec3 .items > a div span small{font-size:1rem;color:#66c166;}
#news .sec3 .items > a div p{
    font-size:1rem;
    margin-top:0.9rem;
}
#news .sec3 .items > .pagenav{
    margin-top:40px;
    width:100%;
    text-align:center;
}
#news .sec3 .items > .pagenav li{
    margin-left:10px;
    margin-right:10px;
    font-size:1rem;
    display:inline-block;
}
#news .sec3 .items > .pagenav li a{
    opacity:0.7;
    font-size:1rem;
}

#news.detail .sec3{max-width:1027px;margin-top:68px;}
#news.detail .sec3 .archive{width:12.5%;}
#news.detail .sec3 .archive a{
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    font-size:1.05rem;
    color:#b9b9b9;
    margin-bottom:0.4rem;
}
#news.detail .sec3 .archive a:nth-of-type(n + 6){display:none;}
#news.detail .sec3 .archive > a.current{
    color: #000028;
}
#news.detail .sec3 .archive > span{
    display:block;
    margin-top:30px;
    cursor:pointer;
}
#news.detail .sec3 .archive > span a{
    position:relative;
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    color:#b9b9b9;
    font-size:1.1rem;
    display:inline-block;
}
#news.detail .sec3 .archive > span a:after{
    content: "";
    display:inline-block;
    position:absolute;
    width: 0;
    height: 0;
    top:20%;
    margin-left:0.5rem;
    border: 5px solid transparent;
    border-top: 11px solid #b9b9b9;
    transition:all .5s;
}
#news.detail .sec3 .archive > span a.on:after{
    content: "";
    display:inline-block;
    position:absolute;
    width: 0;
    height: 0;
    top:-2%;
    margin-left:0.5rem;
    border: 5px solid transparent;
    border-bottom: 11px solid #b9b9b9;
    transition:all .5s;
}




#news.detail .sec3 .contents{width:75%;position: relative;
    margin-right: auto;}
#news.detail .sec3 h2{
    position:relative;
    font-size:1.55rem;
    line-height:2em;
    margin-top: -0.4em;
}
#news.detail .sec3 h2.new:before{
    content:"";
    display:block;
    position:absolute;
    left:0;
    transform:translateY(-100%);
    background-position:center;
    background-size:contain;
    background-repeat:no-repeat;
    background-image:url("/images/common/new.svg");
    width:40px;
    height:16px;
}
#news.detail .sec3 .contents > span{margin-top:25px;display:block;}
#news.detail .sec3 .contents > span time{font-size:1rem;}
#news.detail .sec3 .contents > span small{font-size:1rem;color:#66c166;}
#news.detail .sec3 .contents .thumb{
    width:100%;
    height:0;
    background:rgba(0,0,0,0.4);
    padding-bottom:63%;
    margin-top:77px;
}
#news.detail .sec3 .contents .tsumiki{
    margin-top:59px;
}
#news.detail .sec3 .contents .tsumiki > p{
    font-size:1rem;
}

#news.detail .sec3 .contents .tsumiki > div {margin-top:56px;}
#news.detail .sec3 .contents .tsumiki > div div{}

#news.detail .sec3 .contents .tsumiki .link a{
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    color:#acacac;
    position: relative;
    font-size:0.85rem;
    display: inline-block;
    font-size:1.1em;
    transition:color .5s;
    width:auto;
}
#news.detail .sec3 .contents .tsumiki .link a:after{
    content:"";
    display:inline-block;
    position:relative;
}
#news.detail .sec3 .contents .tsumiki .link a:after{
    content: "";
    display: block;
    position:absolute;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left: 11px solid #acacac;
    top:49%;
    transform:translatey(-50%);
    right:-0.5rem;
    transition:all .5s;
}
#news.detail .sec3 .contents .tsumiki .link a:hover{
    color:#777;
}
#news.detail .sec3 .contents .tsumiki .link a:hover:before{
    border-left:1px solid #777;
    color:#777;
}
#news.detail .sec3 .contents .tsumiki .link a:hover:after{
    border-left: 11px solid #0092c9;
}
#news .archive a{
    transition:all .5s;
}
#news .archive a:hover{
    color:#000028;
}








#privacy main{margin-bottom:200px;}
#privacy .deco3{font-size:1rem;}
#privacy .deco3:after {
    top: 54%;
}
#privacy section:nth-of-type(n+2) p,
#privacy section:nth-of-type(n+2) span,
#privacy section:nth-of-type(n+2) small{font-size:1rem;}
#privacy .sec2{margin-top:213px;max-width:1027px;border-bottom: 1px solid gray;
    padding-bottom: 97px;}
#privacy .sec2 h2{font-size:1.5rem;}
#privacy .sec2 > div:first-of-type{margin-top:54px;padding-bottom:71px;border-bottom:1px solid gray;}
#privacy .sec2 > div:first-of-type > p{width:35%;}
#privacy .sec2 > div:first-of-type > div{width:61%;}
#privacy .sec2 > div:first-of-type > div p{
    text-indent:-1rem;
    padding-left:1rem;
    margin-bottom: 1.9rem;
}
#privacy .sec2 > div:first-of-type > div span{display:block;text-align:right;margin-top: 5.6rem;}

#privacy .sec2 > div:last-of-type{margin-top:82px;}
#privacy .sec2 > div:last-of-type h3{font-size:1.3rem;width:35%;}
#privacy .sec2 > div:last-of-type div{width:61%;}
#privacy .sec2 > div:last-of-type div p:nth-of-type(1){border-bottom:1px dotted gray;padding-bottom:37px;margin-bottom:23px;}
#privacy .sec2 > div:last-of-type div p:nth-of-type(2){border-bottom:1px dotted gray;padding-bottom:37px;margin-bottom:23px;}
#privacy .sec2 > div:last-of-type div p:nth-of-type(3){border-bottom:1px dotted gray;padding-bottom:37px;margin-bottom:50px;}
#privacy .sec2 > div:last-of-type div p:nth-of-type(3) img{width:40%;}
#privacy .sec2 > div:last-of-type div p:nth-of-type(3) span{width:50%;}

#privacy .sec2 img{
    top: 8px;
    position: relative;
    width: 30%;
    height: 60px;
    max-width: 64px;
    margin-right: 4%;
}
#privacy .sec2 .img{
    justify-content: flex-end;
}
#privacy .sec3{
    margin-top:83px;
    max-width:1027px;
    border-bottom: 1px solid gray;
    padding-bottom: 97px;
}
#privacy .sec3 h2{font-size:1.5rem;}
#privacy .sec3 .t1{
    margin-top: 53px;
    margin-top: 53px;
    padding-bottom: 97px;
    border-bottom: 1px dotted gray;
}
#privacy .sec3 .t2{
    margin-top:82px;
}
#privacy .sec3 .t3{
    margin-top: 60px;
    padding-bottom: 97px;
    border-bottom: 1px dotted gray;
}
#privacy .sec3 .t4{
    margin-top:82px;
}
#privacy .sec3 .t5{
    margin-top:60px;
}
#privacy .sec3 .t6{
    margin-top:91px;
    margin-top: 91px;
    padding-bottom: 96px;
    border-bottom: 1px dotted gray;
}
#privacy .sec3 .t7{
    margin-top:83px;
}
#privacy .sec3 .t7 > p{
    width:48%;
    padding-bottom: 66px;
    border-bottom: 1px dotted gray;
}
#privacy .sec3 .t8{
    margin-top:83px;
}
#privacy .sec3 .t8 > p{
    width:48%;
    padding-bottom: 66px;
    border-bottom: 1px dotted gray;
}
#privacy .sec3 .t9{
    margin-top:83px;
}
#privacy .sec3 .t9 > p{width:48%;}

#privacy .sec4 {
    margin-top: 113px;
    max-width: 1027px;
    border-bottom: 1px solid gray;
    padding-bottom: 97px;
}
#privacy .sec4 > p{
    margin-top: 84px;
}
#privacy .sec4 > div {margin-top:60px;}
#privacy .sec4 > div div{width:48%;}
#privacy .sec4 > span{
    position:absolute;
    right:0;
    bottom: 0.5em;
}
#privacy .text > div{width:48%;font-size:1rem;line-height:1.9em;}
#privacy .text p{text-indent:-1.25rem;padding-left:1.1rem;}
#privacy .text span{display:block;text-indent:-1.25rem;padding-left:1.1rem;}
#privacy .text span span{text-indent:0;padding-left:0;}
#privacy .text small{display:block;text-indent:-1.4rem;padding-left:1.1rem;}
#privacy .deco3:before{content:none;}


#contact main{margin-bottom:164px;}
#contact .sec2{max-width:1027px;
margin-top: 215px;
}
#contact .sec2 > span{
    font-size: 1rem;
    display:block;
    width:100%;
    margin-bottom:95px;
}
#contact .sec2 h2{
    font-size:1.55rem;
}
#contact .sec2 dl{
    margin-top: 25px;
    border-bottom: 1px solid gray;
    padding-bottom: 29px;
}
#contact .sec2 dl.req dt:after{
    content:"※必須";
    color:red;
    margin-left:0.5rem;
}
#contact .sec2 dl:first-of-type{padding-bottom:0px;}
#contact .sec2 dl:nth-of-type(2){padding-bottom:3px;border-bottom:1px solid gray;}
#contact .sec2 dl:nth-of-type(3){margin-top:1.3rem;padding-bottom:7px;}
#contact .sec2 dt{font-size:1rem;width:33%; }
#contact .sec2 dd{font-size:1rem;width:61%;}
#contact .sec2 dd a{
    width:100%;
    font-size: 1rem;
    padding: 1.2em 0;
    border-bottom: 1px dotted gray;
    margin-bottom: 0.9rem;
    margin-top: -1.2rem;
}
#contact .sec2 dd a:last-of-type{border:none;margin-bottom:0;}
#contact .sec2 dl.tel_link{padding-bottom:1rem;}
#contact .sec2 dl dd > p{margin-bottom:1.8rem;}
#contact .sec2 dl.tel_link a{padding-top:0.8rem;padding:0;margin:0;border:none;}
#contact .sec2 dl.tel_link a:last-of-type{padding-left:2rem;margin-top:0.5rem;}


#contact.form .sec2{max-width:800px;}
#contact.form dl{
    margin-top: 25px;
    border-bottom: 1px solid gray;
    padding-bottom: 25px!important;
}
#contact.form dl:last-of-type{border:none;}
#contact.form label{display:inline-block;}
#contact.form input[type="text"]{
    width:80%;display:inline-block;
    padding:0.2rem 0.5rem;
    border: none;
    outline: none;
    -webkit-appearance: none;
    background: #eee;
}
#contact.form input[type="radio"]{margin-right:0.8rem;width:auto;}
#contact.form textarea{
    width:100%;
    height:8rem;
    padding:0.2rem 0.5rem;
    border: none;
    outline: none;
    -webkit-appearance: none;
    background: #eee;
}
#contact.form dl dt{width:25%;}
#contact.form dl dd{ width:70%;}
#contact.form form a{margin-top:5rem;}
#contact.form form a:before{content:none;}

#contact.form .f1 label{ width:20%;margin-right:3rem;}
#contact.form .f2 label{ width:49%;}
#contact.form .f2 label input{ margin-left:1rem;}
#contact.form .f3 label{ width:49%;}
#contact.form .f3 label input{ margin-left:1rem;}
#contact.form .f4 input:first-child{ margin-bottom:1rem;}
#contact.form .f5 input{width:20%;}
#contact.form .f5 input{width:20%;}
#contact.form .f8 label{width:100%;line-height:1.9rem;}
#contact.form .f10 small{color:gray;cursor:pointer;}
#contact.form .f10 small a{margin-top:0!important;padding:0!important;display:inline;}

#contact.form input[type="submit"]{
    font-family: 'DIN Next LT W01 Light' , sans-serif;
    background-color: #66c166;
    color: white;
    position: relative;
    font-size: 0.85rem;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    padding: 12px 62px;
    display:block;
    border:none;
    margin-top:80px;
}
#company.group{}
#company.group main{margin-bottom:200px;}
#company.group .sec2{
    margin-top:213px;
    max-width:1027px;
}
#company.group .sec2 h2{
    font-size:1.5rem;
    padding-bottom:50px;
    border-bottom: 1px solid gray;
}
#company.group .sec2 > div{
        margin-bottom: 34px;
    padding-top: 58px;
    border-bottom: 1px dotted gray;
    padding-bottom: 66px;
}

#company.group .sec2 > div > div{width:48%;}
#company.group .sec2 > div > div:nth-of-type(1) img{width:80%;max-width:280px;position:relative;display:block;left:50%;transform:translateX(-50%);}
#company.group .sec2 > div > div:nth-of-type(2) h3{top: -0.2em;position: relative;}
#company.group .sec2 > div > div:nth-of-type(2) h3{font-size:1.5rem;}
#company.group .sec2 > div > div:nth-of-type(2) span{display:block;margin-top:5px;line-height:1.9em;}
#company.group .sec2 > div > div:nth-of-type(2) span.green{
    margin:0.6rem 0 1.5rem 0;
}
#company.group .sec2 > div > div:nth-of-type(2) a{left:0;transform:none;margin-top:24px;padding: 12px 53px;}
#company.group .sec2 > div > div:nth-of-type(3) {margin-top:55px;}
#company.group .sec2 > div > div:nth-of-type(3) span{margin-bottom:6px;width:100%;font-size:1rem;;}
#company.group .sec2 > div > div:nth-of-type(4){margin-top: 54px;}
#company.group .sec2 > div > div:nth-of-type(4) dt{width:16%;font-size:1rem;line-height:1.9rem;}
#company.group .sec2 > div > div:nth-of-type(4) dd{width:79%;font-size:1rem;line-height:1.9rem;}
#company.group .sec2 > div > div:nth-of-type(4) dl:nth-of-type(n+2){margin-top:30px;}

#company.group .sec2 > div:nth-of-type(n+2) > div:nth-of-type(4) dt{width:10%;}
#company.group .sec2 > div:nth-of-type(n+2) > div:nth-of-type(4) dd{width:85%;}


/*
#company.group .sec2 > div > div:first-child span{margin-top:0.35rem;font-size:1rem;display:block;}
#company.group .sec2 > div > div:last-child{}
#company.group .sec2 > div > div:last-child h3{font-size: 1.5rem;}
#company.group .sec2 > div > div:last-child span{display:block;font-size: 1rem;
    line-height: 1.9em;
    margin-top: 0.2em;
}
#company.group .sec2 > div > div:last-child span.green{
    margin-top:20px;margin-bottom:20px;
}
#company.group .sec2 > div > div:last-child a{
    left:0;
    transform:none;
    margin-top:24px;
}
#company.group .sec2 > div > div:last-child a{margin-bottom:105px;padding: 11px 52px;}
#company.group .sec2 > div > div:last-child dl{margin-bottom:27px;}
#company.group .sec2 > div > div:last-child dt{width:20%;font-size:1rem;line-height:1.9em;}
#company.group .sec2 > div > div:last-child dd{width:78%;font-size:1rem;line-height:1.9em;}
#company.group .sec2 > div:nth-of-type(n+2) dt{
    width:12%!important;
}
#company.group .sec2 > div:nth-of-type(n+2) dd{
    width:85%!important;
    font-size:1rem;
    line-height:1.9em;
}
#company.group .sec2 > a {}
*/
#company.group .sec2 > a {
    display: inline-block;
    margin-top: 55px;
    font-size: 1rem;
}