@charset "utf-8";
*{margin: 0; padding: 0;}
ul{list-style: none;}
a{text-decoration: none; color: #000;}

@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');

/********* 왼쪽 메뉴 하단 ***************/

.lang_list{position: absolute; bottom: 180px; left: 50px;}
.lang_list ul{display: flex; flex-wrap: wrap;}
.lang_list ul li a{color: #000; font-size: 17px; font-weight: 500; position: relative; z-index: 2;}
.lang_list ul li a::after{content: "ㅣ"; color: #000; margin-right: 5px; margin-left: 5px;}
.lang_list ul li:last-child a::after{opacity: 0;}
.lang_list ul li a::before{content: ""; position: absolute; width: 70%; height: 8px; background-color: #8f53ffbd; left: -3px; bottom: 0; z-index: -1; display: none;}



.main_body .lang_list ul li a{color: #fff; font-size: 17px; font-weight: 500; position: relative; z-index: 2;}
.main_body .lang_list ul li a::after{content: "ㅣ"; color: #fff; margin-right: 5px; margin-left: 5px;}
.main_body .lang_list ul li:last-child a::after{opacity: 0;}
.main_body .lang_list ul li a::before{content: ""; position: absolute; width: 70%; height: 8px; background-color: #8f53ffbd; left: -3px; bottom: 0; z-index: -1; display: none;}

/* #aside .lang_list ul li a{color: #fff;} */
.main_body #aside.main_aside.on .lang_list ul li a{color: #525252;}
.main_body #aside.main_aside.on .lang_list ul li a::after{color: #525252;}



.lang_list ul li.on a::before{display: block;}



.mb_mypage {position: absolute; bottom: 60px; left: 50px;}


.mb_mypage p {font-size:12px; line-height:24px;     letter-spacing: -0.5px;}


.main_body .mb_mypage p {color:#fff; font-weight:200}
.mb_mypage b {font-weight:200}


.main_body #aside.main_aside.on .mb_mypage p {color:#222}

/*서브페이지 상단 공통*/

#container_title {display:none}
.left-content .sub_top_content{position: relative;}
.left-content .sub_top_content > p:nth-child(1){
    margin-top: 120px;
    color: #525252;

}
.left-content .sub_top_content > p:nth-child(2){
    margin: 45px 0px 0px;
    font-size: 36px;
    line-height: 50px;
	letter-spacing: -0.5px;
}
.left-content .sub_top_content > p:nth-child(2) span{
    font-weight: 800;  color: #9053ff;
}
.left-content .sub_top_content > p:nth-child(2) b{
   font-weight: 800; color: #000;
}
.left-content .sub_top_content > p:nth-child(3) {
    font-size:28px; font-weight: bold; color: #1f1f1f; padding-top:10px; 	letter-spacing: -0.5px;
}
.left-content .sub_top_content .img-banner{
	margin-top:45px;
    width: 100%; height: auto;
    position: relative;
/*	background:url('../img/company/banner-img.png') no-repeat;*/
	
	text-align:center;
}

.left-content .sub_top_content .img-banner.chart{
	background:url('../img/company/banner-img.png') no-repeat;
}
.left-content .sub_top_content .img-banner.about{
	background:url('../img/company/banner-about-img.png') no-repeat;
}
.left-content .sub_top_content a.link-btn{font-size: 18px; position: absolute; right: 0; bottom: 0;}


.left-content .sub_top_content .img-banner .banner-txt {padding:37px 0px}
.left-content .sub_top_content .img-banner .banner-txt p{
    color: #fff;
    font-size: 30px;
    line-height: 40px;
}

.left-content .sub_top_content .img-banner .banner-txt p:last-child{transform: scaleY(-1); }
.left-content .sub_top_content .img-banner .banner-txt p.red{color: #9053ff;}

.red{color: #9053ff;}

/*조직도*/

.left-content .chart-content .chart-img{text-align:center; padding: 145px 0;}
.left-content .chart-content .chart-img img{ max-width: 960px; width: 100%;}


.top_subtxt  {padding:30px 0px}
.top_subtxt ul  {display: flex; justify-content: space-between;  word-break: keep-all;}
.top_subtxt ul li {width:100%; font-size:17px; line-height:30px; text-align: center;}
.top_subtxt ul li b{font-weight: bold;}


/***************************** 수행실적 *************************/


  .history-body{position:relative; padding-bottom:100px}
  .bar-box{position:absolute;top:0px;left:50%;z-index:2;}
  .bar-box > .bar{position:absolute;top:0;left:50%;width:3px;height:75px; padding-bottom:75px;background:#ec1b26;}
  .bar-box > .bar::after{content:'';position:absolute;left:-18px;bottom:-37px;display:block;width:38px;height:38px;background:url(../img/company/history-bar-btn.png) no-repeat center;}

.year-cont-wrap{position:relative;}
  .year-cont{position:relative;display:flex;padding:40px 0;}
  .year-cont::before{content:'';position:absolute;top:0;left:calc(50% - 1px);width:3px;height:100%;background:#ddd;}
  .year-cont:first-child{padding:100px 0 40px;padding-left:50%}
  .year-cont:first-child .year-txt-wrap{width:100%;}
  .year-cont:nth-child(2n-1) .year-txt-wrap{order:2;padding-left:50px;}
  .year-cont:nth-child(2n-1) .year-img-wrap{order:1;padding-left:0;padding-right:50px;}
  .year-cont:nth-child(2n) .year-txt-wrap{text-align:right;padding-right:50px;}
  .year-cont:nth-child(2n) .year-cont-date .inter{float:right;padding-right:0;padding-left:15px;}
  .year-txt-wrap{width:50%;}
  .year-cont-tt{padding-bottom:10px;font-size:20px;color:#ec1b26;font-weight:700;}
  .year-cont-tt span {color:#000000}
  .year-cont-date .text{color:#000;padding-bottom:10px; font-size:24px; font-weight:800; line-height:36px}
  .year-cont-date .text b {font-size:18px; font-weight:500}
  .year-cont-date .text::after{content:'';clear:both;float:none;}
  .year-cont-date .inter{padding-right:15px;font-size:17px;font-weight:600;color:#222;}
  .year-img-wrap{position:relative;top:5px;width:50%;padding-left:50px;}
 


/********************** work **************************************/
.img-banner.work_bi{background:url('../img/work/banner-img.png') no-repeat;}
.img-banner.business{background:url('../img/business/banner-img.png') no-repeat;}
.img-banner.cost{background:url('../img/business/banner-img01.png') no-repeat;}
.img-banner.work_web{background:url('../img/work/banner-img01.png') no-repeat;}
.img-banner.work_catalog{background:url('../img/work/banner-img02.png') no-repeat;}
.img-banner.work_package{background:url('../img/work/banner-img03.png') no-repeat;}
.img-banner.work_film{background:url('../img/work/banner-img04.png') no-repeat;}
.img-banner.work_photo{background:url('../img/work/banner-img05.png') no-repeat;}


/********************** 공지사항 **************************************/

.img-banner.notice{
	background:url('../img/notice/notice/banner-img.png') no-repeat;
}

/********************** 견적문의 **************************************/
.img-banner.contact{
	background:url('../img/notice/contact/banner-img.png') no-repeat;
}



/* 하단 회색 푸터부분 */
.footer{
    width: 100%; height: 610px;
    background-color: #222;
}
/* 오른쪽 bg부분 */
.bg-content{
    width: 14.2%; height: 1980px;
    background-color: #ec1b26;
    position: fixed;
    top: 0;right: 0;
}

.center {text-align:Center; }
.cont img {max-width:100%}

/**************회사소개******************/
.on {display:block}

.catalog {padding-top:30px; text-align:right}
.catalog a {border:1px solid #d2d2d2; padding:15px 25px; transition: 0.35s;}
.catalog a:hover {border:1px solid #ec1b26; color:#ec1b26;}

.subpage_tit {padding-top:100px}
.subpage_tit h2{font-size:40px; padding-top:10px; font-weight:800}
.subpage_tit p{font-size:20px;}

.subpage_tit01 {padding-top:100px}
.subpage_tit01 h2{font-size:24px; padding-top:10px; font-weight:800}
.subpage_tit01 p{font-size:18px; padding-top:10px; font-weight:bold}

.section01{ text-align: center; padding: 50px 20px; border-top: 1px solid #5e1986; border-bottom: 1px solid #5e1986; box-sizing: border-box; margin-top: 40px; background-image: url(../img/company/ideo-banner-img.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.section01 h3{font-size: 30px; font-weight: bold;}
.section01 h3 b{font-weight: 800; position: relative;}
.section01 h3 b::after{content: "・"; font-size: 25px; position: absolute; top: -20px; left: 50%; transform: translateX(-50%); color: #5e1986;}
.section01 p{font-size: 17px; line-height: 160%; padding-top: 20px;}

.section02 {padding-top:80px}
.section02 ul {display: flex;  flex-wrap: wrap;}
.section02 ul li {width:calc(33.3% - 20px); padding-bottom:100px; margin-right:20px}
.section02 ul li h2 {font-size:20px; line-height:32px; color:#ec1b26; font-weight:bold; padding:20px 0px 10px}
.section02 ul li p {font-size:16px; line-height:28px; margin-top: 10px;}

.section03{padding: 50px 0px 20px;}
.section03 .slider-wrap{padding: 0 40px;}
.section03 .slider-wrap div{text-align: center;}
.section03 .slider-wrap div p{font-size: 16px; padding-top: 20px;}
.section03 .slider-wrap div img{display: inline-block; border: 1px solid #ebebeb;}
.section03 .slider-wrap .slick-prev,
.section03 .slider-wrap .slick-next{position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
color: transparent; border: none; background-color: transparent; background-repeat: no-repeat; width: 35px; height: 35px;}
.section03 .slider-wrap .slick-prev{left: 0; background-image: url(../img/company/arrow-prev.png);}
.section03 .slider-wrap .slick-next{right: 0; background-image: url(../img/company/arrow-next.png);}

.section04{margin:100px 0 130px; text-align: center;}
.section04 p{font-size: 35px; line-height: 160%; padding-bottom: 50px;}
.section04 p span,
.section04 p b{font-weight: 800;}

a.link-btn{font-size: 25px; font-weight: 800; font-style: italic; border-bottom: 1px solid #9053ff; padding-bottom: 5px; transition: all 0.2s;}
a.link-btn b{color: #9053ff; font-style: normal;}
a.link-btn:hover{color: #9053ff;}

/**************미디어******************/
.youtube-ctt{width: 100%; margin: 50px 0 130px;}
.youtube-ctt video{width: 1200px; max-width: 100%; height: 600px; bottom: 0 auto; background-color: #d2d2d2;}




/* .section03 {padding-top:80px;}
.section03 ul {display: flex;  flex-wrap: wrap;}
.section03 ul li {width:20%; font-size:16px;  cursor:pointer; border:1px solid #fff; border-bottom:1px solid #d1d1d1; text-align:center; padding:15px 5px; transition: 0.25s; word-break: keep-all;}
.section03 ul li:hover {color:#ec1b26;  border:1px solid #d1d1d1;  border-bottom:1px solid #fff}
.section03 ul li.on {color:#ec1b26;  border:1px solid #d1d1d1;  border-bottom:1px solid #fff} */



/* .section02_01 {padding:80px 0px 100px;  }
.section02_01:after {content:""; display:block; clear:both}
.section02_01 ul {display: flex;  flex-wrap: wrap;}


.section02_02 {padding:80px 0px 100px;  display:none}
.section02_02:after {content:""; display:block; clear:both}

.section02_03 {padding:80px 0px 100px;  display:none}
.section02_03:after {content:""; display:block; clear:both}

.section02_04 {padding:80px 0px 100px;  display:none}
.section02_04:after {content:""; display:block; clear:both}

.section02_05 {padding:80px 0px 100px;display:none}
.section02_05:after {content:""; display:block; clear:both}
.section02_05_bg {	background:url('../img/company/about_img_bg.png') no-repeat;  width: 100%; height: auto; background-size:cover; margin-top:30px;}
.section02_05_bg ul {display: flex; justify-content: center;}
.section02_05_bg ul li{text-align:center;  position: relative; padding:60px 20px}
.section02_05_bg ul li:after {content:"";  position: absolute; background:url('../img/company/arrow.png') no-repeat;  width:13px; height:14px; display:inline-block; 	transform: translate(-50%); top:30%; right:0px}
.section02_05_bg ul li:last-child:after {display:none}

.section02_05_bg ul li h2 {color:#ec1b26; font-size:17px; padding:20px 0px 10px;}
.section02_05_bg ul li p {color:#fff; font-size:14px} */





.icon_left img{background:#fbfcfc; padding:20px; border-radius:50%;  box-shadow: 5px 5px 8px rgba(0,0,0, .3),0 0 3px rgba(0,0,0, .3); transition: 0.35s;}
.icon_left {float:left; width:20%}
.icon_left h2 {display:none}
.cont {float:right; width:80%}
.cont h2 {font-size:24px; font-weight:bold; padding-bottom:20px}
.cont h3 {font-size:24px; font-weight:bold; position: relative; display:inline-block; padding-right:10px; padding-top:50px; padding-bottom:20px;}
.cont h3:before {content:""; display:block; width:100%; position: absolute; background:#fbd1d4; height:12px; z-index:-1; bottom:20px}
.cont h3:after {content:""; display:block; width:5px; right:0px; position: absolute; background:#f5888e; height:12px; z-index:-1; bottom:20px}
.cont h3 b{font-weight:800; }
.cont p {font-size:17px; line-height:30px; font-weight:300; word-break: keep-all;}

.cont h4 {font-size:24px; font-weight:bold; line-height:36px; padding-top:50px; padding-bottom:10px;}

.type01 {display: flex; justify-content: space-between;}
.type_txt {display: flex; justify-content: space-between; padding-top:10px;}
.type_txt li {}
.type_txt li:first-child {font-weight:bold}
.type_txt li:first-child:before {content:""; display:inline-block; background:#ec1b26; width:10px; height:10px; margin-right:5px;} 

.pic_lay {padding-top:100px;}
.pic_lay div{padding-bottom:25px;}


.img_style01 {display: flex; }
.img_style01 li { padding-bottom:25px;}
.img_style01 li:first-child{padding-right:25px;}


.img_style02 {display: flex; }
.img_style02 li { padding-bottom:25px;}
.img_style02 li:first-child{padding-right:25px;}
.img_style02 li:nth-child(2){padding-right:25px;}



/* 02.php 부분 */


.left-content .sub_top_content.txt_04 > p:nth-child(2) span{
	color: #ec1b26;
}


.os_mac .roughmap_maker_label .roughmap_lebel_text {font-family:'NanumSquare', dotum, sans-serif !important;}

/* 02.php 배너 이미지 변경 */
.left-content .sub_top_content .img-banner.bg_04{
	background:url('../img/company/04-banner.png') no-repeat;
}


/* business*/
.process {padding:50px 0px}
.process ul {    display: flex; justify-content: space-between;}
.process ul li {width:calc(20% - 20px); padding:0px 10px; text-align:Center}
.process ul li div {border:1px solid #c2c2c2; padding:30px; border-radius:50%; display:inline-block; position: relative;}
.process ul li img {}
.process ul li div:after {content:""; display:block; background:url('../img/business/arrow_right.png') no-repeat; width:33px; height:18px; position: absolute; background-size:cover; top:50%; transform: translateY(-50%); right:-60%}
.process ul li:nth-child(5) div:after {display:none}
.process ul li:last-child {display:none}
.process ul li h2 {color:#ec1b26; font-size:20px; font-weight:800;  padding:30px 0px 10px}
.process ul li p {font-size:14px; line-height:25px; letter-spacing: -0.9px; word-break: keep-all;}


@media (max-width:1650px){
.process br.none {display:none}
.process ul li div:after {right:-45%}

}

@media (max-width:1450px){
.process ul li div:after {right:-70%}
.process ul li {width:calc(33% - 20px); padding-bottom:70px}
.process ul li:nth-child(3) div:after { top:auto; transform: translateX(0%)  scaleX(-1) rotate(45deg); bottom:-160px; left:0%}
.process ul {flex-wrap: wrap;     justify-content: center;}
.process ul li:nth-child(4) {display:none}
.process ul li:nth-child(5) div:after {display:block; transform: translateX(0%)  scaleX(-1) ; }
.process ul li:last-child  {display:block}
.process ul li:last-child div:after {display:none ;  }

.section04 p{font-size: 30px;}
a.link-btn{font-size: 20px;}

.left-content .sub_top_content a.link-btn{position: static; margin-top: 20px; display: inline-block;}
}

@media (max-width:1290px){
.process ul li div:after {right:-50%}
}

@media (max-width:1200px){
.process ul li div:after {right:-10vw}

.section04 p{font-size: 25px;}

.section01 h3{font-size: 25px;}
}

@media (max-width:850px){
.process ul li div:after {right:-7vw}
.process ul li:nth-child(3) div:after { bottom:-170px;}

.section01 p br.none{display: none;}
}

@media (max-width:680px){
.process ul {justify-content: space-between;}
.process ul li div {border:1px solid #c2c2c2; padding:30px;}
.process ul li img {width:45px}
.process ul li {width:calc(50% - 20px); padding-bottom:70px}
.process ul li div:after {display:none}
.process ul li:nth-child(5) div:after  {display:none}

.section04 p{font-size: 20px; word-break: keep-all;}
a.link-btn{font-size: 18px;}

.section01 h3{font-size: 22px;}
.section01 p{font-size: 15px;}

.section03 .slider-wrap div p{font-size: 15px;}
}

/*위치 리스트*/
.map-list{
	max-width: 100%; height: auto;

}
.map-list ul li{
	width: 100%; height: auto;
	border-top: 1px solid #d0d0d0;
	box-sizing: border-box;
	padding: 50px 30px;
	position: relative;
}
.map-list ul li:nth-child(1){margin-top: 30px;}
.map-list ul li:nth-child(6){border-bottom: 1px solid #d0d0d0; margin-bottom: 70px;}

.map-list ul li p:nth-child(1){
	font-size: 26px;
	font-weight: bold;
	margin-bottom: 10px;
}
.map-list ul li p:nth-child(2){
	font-size: 16px;
	line-height:28px;
	font-weight: bold;
	color: #727272;
	margin-bottom: 36px;
}
.map-list ul li .map-left > span{margin-left: 30px; color: #727272; font-size: 14px; position: relative;}
.map-list ul li .map-left > span:nth-child(4),
.map-list ul li .map-left > span:nth-child(5){margin-left: 65px;}

.map-list ul li span:nth-child(3)::after{
	content:".";
	position: absolute;
	color: #ec1b26;
	bottom: 0; left: 24px;
}
.map-list ul li span:nth-child(4)::after{
	content:".";
	position: absolute;
	color: #ec1b26;
	bottom: 0; left: 25px;
}
.map-list ul li:nth-child(1) span:nth-child(5)::after{
	content:".";
	position: absolute;
	color: #ec1b26;
	bottom: 0; left: 45px;
}

.map-left span:nth-child(3)::before{
	content: "" ;
	background:url('../img/company/telephone.png')  no-repeat;
	background-position:center;
	display: inline-block;
	width: 25px; height: 25px;
	position: absolute;
	top: -7px; left: -30px;
}
.map-left span:nth-child(4)::before{
	content: "" ;
	background: url('../img/company/fax.png') no-repeat;
	background-position:center;
	display: inline-block;
	width: 25px; height: 25px;
	position: absolute;
	top: -7px; left: -30px;
}
.map-left:nth-child(1) span:nth-child(5)::before{
	content: "" ;
	background: url('../img/company/email.png') no-repeat;
	background-position:center;
	display: inline-block;
	width: 25px; height: 25px;
	position: absolute;
	top: -7px; left: -30px;
}

.map-list ul li .map_img{
	max-width: 100%;
	padding-top: 25px;
	height:0px; 
	overflow: hidden;
	visibility:hidden;
	clear: both;
	}

.map-list ul li .map_img:after {content:""; display:block; clear:both}
	/* 위치 이미지 */
/*	.map-list ul li .spot-img{
		position: absolute;
		top: 50px;
		right: 30px;
		cursor: pointer;
		width: 100px; height: 100px;
		background-color: #efefef;
		border-radius: 100%;
	}
*/
.map-list ul li:after {content:""; display:block; clear:both}

.map-list ul li .map-left{float:left}
.map-list ul li .spot-img{float:right; position:relative; cursor: pointer; width: 100px; height: 100px; background-color: #efefef;	border-radius: 100%;}
.map-list ul li .spot-img:after {content:""; display:block; clear:both}

	.map-list .spot-img img{
		position: absolute;
		top: 50%; left: 50%;
		transform: translate(-50%, -50%);
		transition: 0.35s;
		filter: grayscale(100%);
	}

	.map-list .spot-img.on img{filter: grayscale(0%);}
	.map-list .spot-img:hover img{filter: grayscale(0%);}


@media (max-width:1430px){
.icon_left {float:left; width:30%}
.cont {float:right; width:70%}
}



@media (max-width: 1280px){
  .year-cont-date .text{font-size:14px; line-height:26px;}
  .year-cont-date .text b{font-size:12px; line-height:24px;}
  .year-cont-date .inter{font-size:16px;}
  .year-cont-list{position:relative;}

  .year-cont-list .text{padding-left:40px;}
  .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list b{left:auto;right:0;}
  .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list .text{padding-right:40px;}
}




@media screen and (max-width:1199px){
.left-content .sub_top_content > p:nth-child(1){font-size:14px}
.left-content .sub_top_content > p:nth-child(2){margin: 45px 0px 0px; font-size: 26px; line-height: 40px;}
.left-content .sub_top_content > p:nth-child(3) {font-size:18px; line-height:30px; padding-top:10px;}

.icon_left {float:left; width:20%}
.cont {float:right; width:80%}
}

@media (max-width: 970px){
  .year-cont{padding:20px 0;}

.section01 ul li {width:calc(50% - 20px);}
.subpage_tit h2{font-size:30px; }
.subpage_tit p{font-size:18px;}


.subpage_tit01 h2{font-size:20px;}
.subpage_tit01 p{font-size:16px;}

.section02 ul li {font-size:14px}

.icon_left img{ padding:20px; width:90px; }
.icon_left {float:left; width:90px; margin-right:20px}
.cont {float:right; width:calc(100% - 110px)}
}

@media (max-width: 765px){
.map-list ul li{padding: 50px 0px;}
.map-list span{display:block}
.map-list ul li p:nth-child(1){font-size: 22px;	margin-bottom: 10px;}
.map-list ul li p:nth-child(2){font-size: 14px;	line-height:28px;margin-bottom: 36px;}

  .map-list ul li .map-left > span:nth-child(4), .map-list ul li .map-left > span:nth-child(5) { margin-left:30px; margin-top:20px;}
	.map-list ul li .spot-img{width:60px; height: 60px; }
	.map-list .spot-img img{width:25px;}

.map-list ul li .map-left{width:calc(100% - 70px)}


.section02_01 {padding:50px 0px 100px;  }
.section02_02 {padding:50px 0px 100px;}
.section02_03 {padding:50px 0px 100px;}
.section02_04 {padding:50px 0px 100px; }
.section02_05 {padding:50px 0px 100px;}
.section02_05_bg ul {flex-wrap: wrap;}
.section02_05_bg ul li {width:50%; padding:30px 20px}
.section02_05_bg ul li br.none {display:none}
.section02_05_bg ul li h2 {display:block; font-size:14px;}
.section02_05_bg ul li p {font-size:12px; line-height:22px;}
.section02_05_bg ul li:after {right:-10px}
.section02_05_bg ul li:nth-child(2):after {    transform: translate(-50%) rotate(145deg); bottom:0px; left:0; top:auto}



.icon_left img{ padding:10px; width:60px; display:inline-block}
.icon_left {float:left; width:90px; margin-right:20px}
.icon_left h2 {font-size:18px; font-weight:bold;margin-left:10px; display:inline-block}




.icon_left {width:100%; float:none}
.cont { float:none; width:100%; padding-top:20px}

.cont h2 {display:none}
.cont h3 {font-size:20px;  padding-right:10px; padding-top:50px; padding-bottom:20px;}
.cont h3:before {content:""; display:block; width:100%; position: absolute; background:#fbd1d4; height:12px; z-index:-1; bottom:20px}
.cont h3:after {content:""; display:block; width:5px; right:0px; position: absolute; background:#f5888e; height:12px; z-index:-1; bottom:20px}
.cont p {font-size:14px; line-height:26px;}
.cont h4 {font-size:20px; font-weight:bold; line-height:30px; padding-top:50px; padding-bottom:10px;}

.type_txt li {font-size:12px;  padding-bottom:10px;}

.img_style01 li { padding-bottom:15px;}
.img_style01 li:first-child{padding-right:15px;}



.img_style02 li { padding-bottom:15px;}
.img_style02 li:first-child{padding-right:15px;}
.img_style02 li:nth-child(2){padding-right:15px;}

}


@media (max-width:680px){
	.left-content .sub_top_content .img-banner .banner-txt p{font-size:20px; line-height:30px;}

	.top_subtxt ul li {font-size:14px; line-height:26px;}


  .year-cont-tt{font-size:18px; line-height:30px;}
  .bar-box{left:25px}
  .year-cont{flex-direction: column;padding-left:70px!important}
  .year-cont::before{left:25px;}
  .year-txt-wrap{width:100%;}
  .year-cont:first-child{padding: 50px 0 0px 0px;}
  .year-cont:nth-child(2n-1) .year-txt-wrap{padding-left:0;}
  .year-cont:nth-child(2n) .year-txt-wrap{padding-right:0;text-align: left;}
  .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list b, .en-page .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list b, .jp-page .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list b, .ch-page .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list b{right:auto;left:0;}
  .year-cont:nth-child(2n) .year-cont-date .inter{padding-left:0;}
  .year-cont:nth-child(2n-1) .year-img-wrap{padding-right:0;}
  .year-cont:nth-child(2n) .year-txt-wrap .year-cont-list .text{padding-right:0px; line-height:28px}
  .year-img-wrap{width:100%;padding-left:0;padding-bottom:20px;order:1;}
  .year-txt-wrap{order:2;}
  .year-cont-date .text b {font-size:12px;line-height:24px;  font-weight:500; display:block}
  .bar-box > .bar::after{transform:scale(.8);bottom:-32px;}
}



@media (max-width:580px){
	.sub_top_content br.none {display:none}
	.top_subtxt ul  {display: flex;     flex-direction: column; word-break: keep-all;}
	.top_subtxt ul li {width:100%; font-size:14px; line-height:26px;}

.section02 ul li {width:100%;  padding-bottom:100px; margin-right:0px}
.section02 ul li h2 {font-size:18px; line-height:30px;}
.section02 ul li p {font-size:14px; line-height:26px}
.section02 br.none {display:none}
.catalog a { padding:15px 15px; }
.section03 ul li {font-size:12px;}
}

