@charset 'utf-8';

.greeting {}
.greeting .con1 { background: #000}
.greeting .con1 .area { display: flex; justify-content: right; align-items: center;  background: url('/img/sw/greeting_bg1.jpg') no-repeat left center / contain;}
.greeting .con1 .area .txt { padding: 8% 0; width: 51%;}
.greeting .con1 .area .txt p { font-size: 45px; font-weight: 500; color: #fff; line-height: 1.3777; text-shadow: 1px 1px 5px rgb(0 0 0 / 80%); }
.greeting .con1 .area .txt p b { font-weight: inherit; color: #c72229;}
.greeting .con1 .area .txt p.sign {padding: 10px 0 0; }
.greeting .con2 { padding: 70px 0 0;}
.greeting .con2 p { padding: 0 0 20px; font-size: 20px;}
.greeting .con2 p b { font-weight: 500; }
.greeting .con2 .p1 { font-size: 25px; font-weight: 500;}

@media (max-width:1320px){
    .greeting .con1 { margin: 0 -10px;} 
}
@media (max-width:1199px){
    .greeting .con2 p .br2 { display: none;}
}
@media (max-width:991px){
    .greeting .con1 .area .txt p { font-size: 35px;}
    .greeting .con2 { padding: 60px 0 0;}
    .greeting .con2 .p1 { font-size: 23px;}
    .greeting .con2 p { font-size: 18px;}
}
@media (max-width:768px){
    .greeting .con1 { padding: 20px 10px;  background: #000 url('/img/sw/greeting_bg2.png') no-repeat right bottom / auto 90%; }
    .greeting .con1 .area { display: block; padding: 20px; background: none; border: 2px solid #fff;}
    .greeting .con1 .area .txt { padding: 20px 0; width: 100%;}       
    .greeting .con2 { padding: 50px 0 0;} 
}
@media (max-width:576px){  
    
    .greeting .con1 .area .txt p { font-size: 30px;}    
    .greeting .con2 { padding: 30px 0 0;}
    .greeting .con2 .p1 { font-size: 20px;}    
    .greeting .con2 p { padding: 0 0 15px ; font-size: 15px;}
}
@media (max-width:480px){
    .greeting .con1 { background-size: 60% auto;}
    .greeting .con1 .area { padding: 20px 10px ;}
    .greeting .con1 .area .txt { padding: 10px 0;}
    .greeting .con1 .area .txt p { font-size: 28px;}    
}
@media (max-width:420px){    
    .greeting .con1 .area .txt { padding: 0;}    
}

.history { position: relative;}
.history .con1 { position: relative; z-index: 2; min-height:700px; }
.history .con1 dl { display: flex; position: relative; padding: 0 0 55px 40px;}
.history .con1 dl dt { position: relative; font-size: 25px; line-height: 25px; font-weight: 500; }
.history .con1 dl dd { padding: 0 0 0 30px; line-height: 25px; }

.history .con1 dl:before,
.history .con1 dl:after { content:''; display: block; position: absolute;}
.history .con1 dl:before { z-index: 2; left: 0; top: 10px; width: 7px; height: 7px;  background: #cfcfcf;  border-radius: 50%; }
.history .con1 dl:after { left: 3px; top: 10px; width: 1px; height: 100%; background: #f9f9f9;}
.history .con1 dl:last-of-type:after { display: none;}
.history .box { position: absolute; right: 0; top: 0; }
.history .box .img { margin: 0 0 30px; }

@media (max-width:1199px){
    .history .box .img { margin: 0 0 20px; }
    .history .box .img img {  width: 400px;}
}
@media (max-width:991px){
    .history .con1 { min-height: auto; background: none;}
    .history .box { display: flex; justify-content: space-between; position: relative;}
    .history .box .img { margin: 20px 0 0; width: 48%;  }
    .history .box .img img { width: 100%;}
}
@media (max-width:768px){
    .history .con1 dl {padding: 0 0 50px 40px;}
}
@media (max-width:576px){
    .history .con1 { background: none;}
    .history .con1 dl { padding: 0 0 40px 30px;}
    .history .con1 dl dt { font-size: 21px; line-height: 21px;}
    .history .con1 dl dd { padding: 0 0 0 20px; line-height: 21px;}
    .history .box .img { width: 49%; }
}
@media (max-width:420px){
    .history .con1 dl { flex-direction: column; }
    .history .con1 dl dt { padding: 0 0 10px; }
    .history .con1 dl dd {padding: 0;}
}

.organization .con1 { overflow-x: auto;}
.organization .con1 .img { min-width:800px; text-align: center;}
.organization .con1 .img img {}

.member #pop {  overflow: auto; display: none;  position: fixed; z-index: 100; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,.8); transition: .2s; cursor:pointer}
.member #pop.on { display: block; }
.member #pop .pc { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.member #pop .mb { display: none; padding: 20px 5px; width: 100%; text-align: center;}
.member .con1 { padding: 0 0 70px; margin: 0 0 70px; border-bottom: 1px solid #e1e1e1;}
.member ul { display: flex; flex-wrap:wrap; margin: 0 -15px -50px;}
.member ul li { margin: 0 15px 50px; width: calc(33.33% - 30px);}
.member ul li p.name { padding: 15px 0 0; font-size: 20px; font-weight: 500; color: #111; }
.member ul li p+p { font-size: 16px;  color: #999; }
.member ul li a { display: block; }
.member ul li a .img { overflow: hidden; position: relative; }
.member ul li a .img img { display: block; width: 100%; text-align: center;}
.member ul li a .img span { opacity: 0; display: block; position: absolute; left: 50%; bottom: -100%; z-index: 2; transform: translateX(-50%); width: 155px; height: 45px; font-size: 14px; color: #fff; line-height: 45px; text-align: center; border: 1px solid #fff; border-radius: 23px; transition: .2s;}
.member ul li a .img:after { opacity: 0; content:''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.4); transition: .2s; }
.member ul li a:hover .img span { opacity: 1; bottom: 12%; }
.member ul li a:hover .img:after { opacity: 1;}


@media (min-width:992px){
.member .con1 ul li { margin: 0 15px 50px; width: calc(25% - 30px);}	
}

@media (max-width:991px){
    .member ul { margin: 0 -10px -50px;}
    .member ul li { margin: 0 10px 50px; width: calc(33.33% - 20px);}
    .member .con1 { padding: 0 0 60px; margin: 0 0 60px; }
}

@media (max-width:940px){
    .member #pop .pc { display: none;}
    .member #pop .mb  { display: block;}
}

@media (max-width:768px){
    .member ul { margin: 0 -10px -40px;}
    .member ul li { margin: 0 10px 40px; width: calc(50% - 20px);}
    .member ul li p.name { font-size: 18px; }
    .member ul li p+p { font-size: 15px;  }
    .member .con1 { padding: 0 0 50px; margin: 0 0 50px; }
}
@media (max-width:576px){
    .member ul li p.name { padding: 15px 0 5px; font-size: 17px;  }
    .member ul li p+p { font-size: 14px; line-height: 1.2; }
    .member ul li a .img span { width: 130px; height: 36px; line-height: 36px; border-radius: 18px;}
    .member .con1 { padding: 0 0 40px; margin: 0 0 40px; }
}
@media (max-width:480px){
    .member ul { margin: 0 -5px -30px;}
    .member ul li { margin: 0 5px 30px; width: calc(50% - 10px);}
}
@media (max-width:400px){
    .member ul { margin: 0 -5px -30px;}
    .member ul li { margin: 0 5px 30px; width: calc(100% - 10px);}
}


.location {}
.location .con1 { overflow: hidden;}
.location dl { display: flex; flex-wrap:wrap; padding: 40px 0 70px;}
.location dl dt,
.location dl dd { padding: 0 0 20px; }
.location dl dt { width: 120px; }
.location dl dd { width: calc(100% - 120px); color: #999;}
.location dl dd:first-of-type { color: #111;}
.location dl dd b { font-weight: 500; }
.location dl dd span { display: block; padding: 0 0 5px;}
.location dl dd span:last-of-type {padding: 0;}
.location .go-map { }
.location .go-map a { display: inline-block; margin: 0 10px 0 0; width: 225px; height: 50px; background: #25c200; text-align: center; font-size: 16px; line-height: 50px; font-weight: 500; color: #fff; border-radius: 5px; }
.location .go-map a:last-of-type { background: #f9e000;  color: #433000; }
@media (max-width:768px){
    .location dl { padding: 40px 0 60px; }
    .location dl dt { width: 90px; } 
    .location dl dd { width: calc(100% - 90px); } 
}
@media (max-width:577px){
    .location dl { padding: 40px 0 30px; }
    .location dl dt { padding: 0 0 5px; width: 100%;} 
    .location dl dd { margin: 0 0 15px; padding: 0 0 15px 5px; width: 100%; border-bottom: 1px dashed #cfcfcf;}    
    .location .go-map a { width: 200px;}
}
@media (max-width:480px){
    .location .go-map a { width: 138px; font-size: 15px;}
}




.business {}
.business ul { flex-wrap:wrap; margin: -15px; }
.business ul li { position: relative; padding: 50px 30px 90px; margin: 15px; width: calc(33.33% - 30px); background: #f9f9f9; transition: .1s;}
.business ul li .num { font-size: 25px; line-height: 1; font-weight: 500; color: #2b4ec1;}
.business ul li h4 { padding: 20px 0 10px; font-size: 25px; font-weight: 500; line-height: 1; }
.business ul li .en { color: #abaaaa; }
.business ul li .tail { padding: 35px 0 0; }
.business ul li:after { opacity:0; content:''; position: absolute; left: 0; top: 0; width: 100%; height: 100%;  border: 3px solid #111111; transition: .1s;}
.business ul li:hover { box-shadow: 0 5px 8px rgba(0,0,0,.11);}
.business ul li:hover:after { opacity:1; }
.business ul li:hover .num { color: #ec0000;}

@media (max-width:991px){
    .business ul { margin: -10px;}
    .business ul li {  padding: 50px 20px 80px; margin: 10px; width: calc(33.33% - 20px);}
}
@media (max-width:768px){
    .business ul { margin: -10px;}
    .business ul li {  padding: 50px 30px 80px; margin: 10px; width: calc(50% - 20px);}
    .business ul li .num { font-size: 23px; }
    .business ul li h4 { font-size: 23px;}
    .business ul li .tail { padding: 25px 0 0; }
}
@media (max-width:576px){
    .business ul li {  padding: 50px 20px 80px; }
    .business ul li .num { font-size: 21px; }
    .business ul li h4 {  padding: 13px 0 7px; font-size: 21px;} 
    .business ul li .tail { padding: 15px 0 0; }
}
@media (max-width:480px){
    .business ul { margin: 0 -5px -20px;}
    .business ul li {  padding: 30px 15px 50px; margin: 0 5px 20px; width: calc(50% - 10px);}
    .business ul li .num { font-size: 19px; }
    .business ul li h4 {  padding: 10px 0 7px; font-size: 19px;} 
    .business ul li .en { word-break: break-all;}
}
@media (max-width:410px){    
    .business ul li {  padding: 30px 20px 50px; width: 100%;}
}