@charset "utf-8";
/* CSS Document */
/*----------
About US
----------*/
/*Company Profile*/
#company-profile{ padding-top:6rem;}
#company-profile h3{width:100%; line-height:1.4em;}
#company-profile .wrap-flex{ margin-top:4rem;}
#company-profile p{ width:min(80%,520px); line-height:2.6em;}
.company-profileimg{ width:35%;  margin-left:4rem; } 
.company-profileimg img{ padding:1rem;box-shadow: 0 0 10px rgba(80,80,80,0.4); }
.company-profile-smallimg{ display:none;}
#company-profile .company-profile-mid{ width:100%; line-height:1.4em;}
#company-profile .company-profile-bottom{ width:100%; line-height:2em; padding-top:2rem;}
/*company info*/
#company-info{padding-top:7vw; padding-bottom:8rem;}
#company-info h1{  font-size:30rem; font-weight:500; text-align:center; -webkit-text-stroke: 1px #F0F0F0;text-stroke: 1px #F0F0F0; color:transparent; } 
#company-info .grid{  grid-template-columns:repeat(4,1fr);align-items: center; }
.company-info-content-txt{ margin-left:2rem;}
.company-info-content h2{  font-weight:700; color:var(--web-theme-color-black);  padding-top:0.6rem;}
.company-info-content span{ display:block; margin-left:0.6rem; margin-top:0.8rem; font-size:2rem; text-transform:lowercase; color:var(--web-theme-color-black);}
#company-info .company-info-content p{ line-height:0;  color:var(--web-theme-color-black);}
/*Corporate Culture*/
#corporate-culture{ padding-bottom:0;}
#corporate-culture img{ width:100%;}
.culture-smallimg{ display:none;}
/*Development history*/
#history{background:url(../images/about/history.webp) no-repeat center center; background-size:cover;  padding-bottom:10vh;}
#history h2{ padding-top:8rem; color:var(--web-theme-color-black);} 
#history h2 span{color:var(--web-theme-color-blue);}
#history .com-line{ width:6rem; height:2px; background-image: linear-gradient(rgba(240,52,51,1) , rgba(240,52,51,1)); margin:2rem auto;}
#history .sy-container{position:relative;}
/*swiper*/
#history-pc{ position:relative; margin-top:10vh;}
#historyline{position:absolute;left:0%;top:42.8%;width:100%;}
#history-pc .swiper-slide:nth-child(2n-1){ flex-direction: column; }
#history-pc .swiper-slide:nth-child(2n){ flex-direction:column-reverse; padding-top:18.8rem;}
.history-info{ height:10rem;}
#history-pc .swiper-wrapper{ padding-bottom:4rem; }
#history-pc .swiper-slide h3{ font-size:3rem; line-height:1.5em;}
.history-info h3{color:var(--web-theme-color);}
.history-info p{ width:min(80%,600px);}
@media screen and (max-width: 1600px) {	#history-pc .swiper-slide:nth-child(2n){ padding-top:21rem;}}
@media screen and (max-width: 1023px) {
/*Company Profile*/
#company-profile{ padding-top:6rem;}
#company-profile h3{width:100%; line-height:1.4em;}
#company-profile .wrap-flex{ flex-direction: column; margin-top:4rem;}
#company-profile p{ width:100%; line-height:2.2em;}
.company-profileimg{ display:none;} 
.company-profile-smallimg{ display:block;margin-top:2rem;}
.company-profile-smallimg img{ padding:0;box-shadow: 0 0 10px rgba(80,80,80,0.4); }
#company-profile .company-profile-mid{ width:100%; line-height:1.4em;}
#company-profile .company-profile-bottom{ width:100%; line-height:2em; padding-top:2rem;}	
/*company info*/
#company-info{padding:8rem 0;}
#company-info .grid{  grid-template-columns:repeat(2,1fr);grid-gap:2rem; padding-top:0; margin-top:0;}
.company-info-content-txt{ margin-left:1rem;}
.company-info-content h2{ padding-top:0.6rem;}
.company-info-content span{ display:block; margin-left:0.6rem; margin-top:0.8rem; font-size:10px;}
#company-info .company-info-content p{line-height:1.4em;}
/*Corporate Culture*/
.culture-img{ display:none;}
.culture-smallimg{ display:block;}
/*Development history*/
#history{background:url(../images/about/history.webp) no-repeat center bottom;  padding-bottom:4rem;} 
#history h2{ padding-top:5rem;  font-weight:500; color:var(--web-theme-color-black);} 
#history .com-line{ width:6rem;}
/*swiper*/
#history-pc .swiper-wrapper{ padding-bottom:2rem;}
.history-info p{ width:100%;}
}

@media screen and (max-width: 767px) {
#company-info h1{ display:none;}
#historyline{position:absolute;left:0%;top:47%;width:100%;}
}
