/*introduce.css*/
body{overflow-x: hidden;}
#container_title{display: none;}

/*visual S*/
.intro_visual_img1{width: 100%; background-image: url('../img/contents/banner_01.png'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.intro_visual_img2{width: 100%; background-image: url('../img/contents/banner_02.png'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.intro_visual_img3{width: 100%; background-image: url('../img/contents/banner_03.png'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.intro_visual_img4{width: 100%; background-image: url('../img/contents/banner_04.png'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.intro_visual_text{color: #fff; padding: 106px 0;}
.intro_visual_text h6{font-size: 40px; line-height: 50px; text-align: center;}
.intro_visual_text p{font-size: 18px; line-height: 25px; text-align: center;}
/*visual E*/

/*section1 S*/
#intro_wrap .sect1{padding: 100px 0;}
.sect_tit h3{font-size: 34px; color: #333; text-align: center; line-height: 40px; font-weight: 400;}
.sect_tit h3 span{font-weight: bold;}
.sect_tit p{font-size: 16px; line-height: 22px; color: #666; text-align: center; padding-top: 30px;padding-bottom: 70px;}
.sect1_con{width: 100%;}
.sect1_img img{width: 100%;}
/*section1 E*/

/*section2 S*/
#intro_wrap .sect2{background-image: url('../img/contents/section2_bg_img.png'); background-size: cover; background-position: center; background-repeat: no-repeat; padding: 100px 0; height: inherit;}
#intro_wrap .sect2 .sect_tit h3{color: #fff;}
#intro_wrap .sect2 .sect_tit h3 span{color: #fff;}
#intro_wrap .sect2 .sect_tit p{color: #fff;}
#intro_wrap .sect2_con{display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1px solid #999;}
#intro_wrap .sect2_con li{width: 25%; border-right: 1px solid #999; padding-bottom: 60px; -webkit-transition: .3s; transition: .3s; padding-left: 15px; padding-right: 15px;}
#intro_wrap .sect2_con li:last-child{border-right: none;}
#intro_wrap .sect2_con li:hover{background: #f2b704;}
#intro_wrap .sect2_con li:hover .sect2_line{background: #fff;}
#intro_wrap .sect2_con .sect2_img{padding: 25px 0;}
#intro_wrap .sect2_con .sect2_icon{width: 80px; height: 80px;margin: 0 auto; background-repeat: no-repeat; background-size: cover; background-position: center;}
#intro_wrap .sect2_con .ic1{background-image: url('../img/contents/section2_icon1.png');}
#intro_wrap .sect2_con .ic2{background-image: url('../img/contents/section2_icon2.png');}
#intro_wrap .sect2_con .ic3{background-image: url('../img/contents/section2_icon3.png');}
#intro_wrap .sect2_con .ic4{background-image: url('../img/contents/section2_icon4.png');}
#intro_wrap .sect2_con .sect2_text h5{color: #fff; line-height: 25px; font-size: 18px; text-align: center;}
#intro_wrap .sect2_con .sect2_line_wrap{padding: 20px 0;}
#intro_wrap .sect2_con .sect2_line{width: 35px; height: 2px; background: #f2b704; margin: 0 auto; -webkit-transition: .3s; transition: .3s;}
#intro_wrap .sect2_con .sect2_text p{color: #fff; line-height: 22px; font-size: 14px; text-align: center; }
/*section2 E*/

/*section3 S*/
.timeline{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;list-style:none;}
.timeline>li{padding: 25px 0; position:relative;-webkit-transform: translateX(-20px);-ms-transform: translateX(-20px);transform: translateX(-20px);width:50%;}
.timeline:before{content:"";position:absolute;top:0;bottom:0;left:50%;width: 1px;background-color: #f2b704;}
.timeline>.history_img{position: relative;}
.timeline>.history_img::before{display: none;}
.timeline>.li_history>ul>li{text-align: right;}
.timeline .li_history{text-align: right; padding-right: 40px;}
.timeline .his_img{width: 400px; position: absolute; top: 0; right: 40px;}
.timeline img{width: 100%; height: auto;}
.timeline .li_history:before {content:"";width: 40px;height: 2px;position: absolute;top: 41px;right: 0;background: #f2b704;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform: translate(50%,-50%);-ms-transform: translate(50%,-50%);transform: translate(50%,-50%);}
.timeline h3 {font-size:28px;margin-bottom: 10px;}
.timeline p {font-size: 20px;line-height: 28px;}
.timeline .li_right{-ms-flex-item-align: end;align-self: flex-end;text-align: left;-webkit-transform: translateX(21px);-ms-transform: translateX(21px);transform: translateX(21px); padding-left: 40px;}
.timeline>.li_right>ul>li{text-align: left;}
.timeline .li_right:before {left: 0; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
#intro_wrap .timeline h3{font-size: 28px; line-height: 30px;}
#intro_wrap .timeline .li_history h3::before{display: block; content: ''; width: 13px; height: 13px; border-radius: 100%;  border: 3px solid #f2b704; float: right; margin: 9px -21px;}
#intro_wrap .timeline .li_right h3::before{display: block; content: ''; width: 13px; height: 13px; border-radius: 100%; border: 3px solid #f2b704;  float: left; margin: 10px -21px;}
#intro_wrap .timeline li ul li{font-size: 18px; line-height: 20px; color: #666; padding: 3px 0;}
#intro_wrap .timeline li ul li span{font-weight: bold; color: #333;}
.history_2nd{display: none;}
.his_2nd{display: block;}
/*section3 E*/

@media screen and (max-width:1250px){
    #intro_wrap .sect_tit p{word-break: keep-all;}
    #intro_wrap .sect_tit p br{display: none;}
}
@media screen and (max-width:1199px){
    #intro_wrap .sect2_con .sect2_text p{word-break: keep-all;}
    #intro_wrap .sect2_con .sect2_text p br{display: none;}
}
@media screen and (max-width:980px){
    .sect_tit h3{font-size: 32px;}
    .timeline .li_history{-ms-flex-item-align: end;align-self: flex-end; text-align: left; padding-right: 0; padding-left: 40px;     -webkit-transform: translateX(21px);     -ms-transform: translateX(21px);     transform: translateX(21px);}
    .timeline>.li_history>ul>li{text-align: left;}
    .timeline .li_history:before{left: 0; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
    #intro_wrap .timeline .li_history h3::before{float: left;}
    .timeline .his_img{width: 360px; top: -200px; left: 0;}
    .timeline{padding-top: 200px;}
    .history_wrap{margin-left: -700px;}
    .history_2nd{display: block;}
    .his_2nd{display: none;}
}
@media screen and (max-width:768px){
    #intro_wrap .sect2_con li{width: 50%;}
    #intro_wrap .sect2_con li:first-child{border-bottom: 1px solid #999;}
    #intro_wrap .sect2_con li:nth-child(2){border-bottom: 1px solid #999; border-right: none;}
    #intro_wrap .sect_tit h3{word-break: keep-all;}
    .intro_visual_text h6{font-size: 36px;}
    .intro_visual_text p{font-size: 17px;}
    #intro_wrap .sect2_con .sect2_text p{font-size: 13px;}
    #intro_wrap .sect2_con .sect2_text h5{font-size: 17px;}
    .history_wrap{margin-left: -600px;}
    #intro_wrap .timeline li ul li{font-size: 17px;}
    #intro_wrap .timeline h3{font-size: 26px;}
}
@media screen and (max-width:650px){
    .history_wrap{margin-left: -520px;}
}
@media screen and (max-width:600px){
    .intro_visual_text h6{font-size: 30px; line-height: 45px;}
    .intro_visual_text p{font-size: 16px;}
}
@media screen and (max-width:570px){
    .history_wrap{margin-left: -430px;}
}
@media screen and (max-width:480px){
    #intro_wrap .sect1{padding: 75px 0;}
    #intro_wrap .sect2_con li{width: 100%; padding-bottom: 40px;}
    #intro_wrap .sect2_con li:first-child{border-right: none;}
    #intro_wrap .sect2_con li:nth-child(3){border-bottom: 1px solid #999; border-right: none;}
    .intro_visual_text h6{font-size: 26px; line-height: 45px;}
    .intro_visual_text p{font-size: 14px; line-height: 20px;}
    .intro_visual_text{padding: 75px 0;}
    .sect_tit h3{font-size: 24px; line-height: 32px; word-break: keep-all;}
    .sect_tit p{font-size: 14px; line-height: 20px; word-break: keep-all;}
    .sect_tit p br{display: none;}
    #intro_wrap .sect2_con .sect2_text h5{font-size: 16px;}
    #intro_wrap .sect2_con .sect2_text p{font-size: 12px; line-height: 20px; word-break: keep-all;}
    .history_wrap{margin-left: -400px;}
    #intro_wrap .timeline li ul li{font-size: 14px;}
    #intro_wrap .timeline h3{font-size: 22px;}
    .timeline .his_img{width: 300px; left: 40px;}
    #intro_wrap .timeline .li_right h3::before{margin: 11px -27px; width: 11px; height: 11px;}
    #intro_wrap .timeline .li_history h3::before{margin: 11px -27px; width: 11px; height: 11px;}
    .timeline .li_history:before{width: 30px;}
    .timeline .li_history{-webkit-transform: translateX(16px);-ms-transform: translateX(16px);transform: translateX(16px);}
}
@media screen and (max-width:430px){
    #intro_wrap .timeline li ul li{word-break: keep-all;}
    .history_wrap{margin-left: -300px;}
    .timeline .his_img{left: 0; top: -120px; width: 245px;}
    .timeline{padding-top: 120px;}
}
@media screen and (max-width:360px){
    .history_wrap{margin-left: -275px;}
    #intro_wrap .timeline h3{font-size: 20px;}
    #intro_wrap .timeline li ul li{font-size: 13px;}
}