@charset "utf-8";
.ready {text-align:center; margin:100px 0px 50px;}
.ready p.stit {display:inline-block; padding:10px 100px; color:#fff; background:#000;}
.ready p.con {position:relative; margin-top:30px; margin-bottom:200px; font-size:25px; ; line-height:140%}
.ready p.con:after {display:block; content:""; position:absolute; left:50%; top:160%; width:1px; height:125px; background:#a8a8a8;}
.ready .end {color:#4e4e4e;}

#con_tit{text-align:center; max-height:205px; width:100%; background:#f5f5f5 url('/open_content/support/img/sub/con_tit.gif') center top no-repeat; overflow:hidden;}
#con_tit .wrap{position:relative; overflow:hidden; z-index:9;}
#con_tit h3{padding-top:45px; padding-bottom:65px; font-size:3em; font-weight:500; line-height:1em; z-index:1;}
#con_tit h3 span{display:block; color:#777; font-size:.4em; font-weight:300;}
#con_tit .share{width:32px; height:32px; margin-right:50px; text-indent:-5000px; z-index:9;}
#con_tit .share,
#con_tit .sns{position:absolute; right:0; top:50%; margin-top:-15px;}
#con_tit .share,
#con_tit .sns li{display:inline-block; margin-left:5px; background:url('/open_content/support/img/sub/sns.png') left center no-repeat; z-index:8;}
#con_tit .sns li{background-position-x:-100px; opacity:0; transition:.5s; z-index:1;}
#con_tit .sns li .sns_toggle{display:none !important; width:0; height:0; font-size:0; line-height:0;}
#con_tit .sns li.sns04{margin-right:0;}
#con_tit .sns li a{display:none; width:32px; height:32px; overflow:hidden; text-indent:-5000px;}
#con_tit .sns li.print{display:inline-block; margin-right:0; background-position-x:right; opacity:1;}
#con_tit .sns.on:after{content:''; position:absolute; right:40px; top:-15%; width:90%; height:120%; border-radius:60px; background-color:#fff; z-index:-1;}
#con_tit .sns.on li{display:inline-block; margin-right:0; height:32px; transition:.3s; opacity:1; overflow:hidden;}
#con_tit .sns li.print a, #con_tit .sns.on li a{display:block;}
#con_tit .sns.on li.sns04{margin-right:60px;}
#con_tit .sns.on li.sns01 a{background:url(/open_content/share/images/inc/ic_sns01.gif) center no-repeat;}
#con_tit .sns.on li.sns02 a{background:url(/open_content/share/images/inc/ic_sns02.gif) center no-repeat;}
#con_tit .sns.on li.sns03 a{background:url(/open_content/share/images/inc/ic_sns04.gif) center no-repeat;}
#con_tit .sns.on li.sns04 a{background:url(/open_content/share/images/inc/ic_sns03.gif) center no-repeat;}
#con_tit .sns.on li.sns00 a {background:url(/open_content/main/img2020/sub/sns_link.gif) center no-repeat; background-size:32px;}
#con_tit .sns.on li.sns03_2 a {background:url(/open_content/main/img2020/sub/sns_kakaotalk.gif) center no-repeat; background-size:32px;}


#location{border-bottom:1px solid #ebebeb}
#location ol:after{display:block; content:''; clear:both}
#location ol>li{position:relative; float:left; height:70px; border-right:1px solid #ebebeb;}
#location .home{padding:25px; border-right:none; background:linear-gradient(to right, #2f5cbc, #7866fa);}
#location .home span{display:block; width:25px; background:url('/open_content/support/img/sub/home.png') center no-repeat; text-indent:-5000px;}
#location ol>li>a{position:relative; display:block; padding:25px 110px 25px 25px; font-size:1.2em; font-weight:300;}
#location ol>li>a:after{content:''; position:absolute; right:25px; width:25px; height:25px;border-radius:100%; background:#ccc url('/open_content/support/img/main/control_left.png') 45% 50% no-repeat; background-size:8px; transform:rotate(-90deg); transition:.3s;}
#location ol>li.dep1>a:hover:after{background-color:#2f5cbd;}
#location ol>li.dep2>a:after{background-color:#7831bf;}
#location ol>li.on>a:after{transform:rotate(90deg); transition:.3s;}
#location ol>li.dep1.on>a:after{background-color:#2f5cbd;}
#location ol>li>ul,
#location li .submenu{display:none; position:absolute; display:none; width:100%; margin-left:-1px; margin-top:-1px; border-left:1px solid #ebebeb; border-right:1px solid #ebebeb; background-color:#fff; box-sizing:unset; z-index:9;}
#location ol>li>ul li,
#location li .submenu li{padding:10px 25px; border-bottom:1px solid #ebebeb;}
#location ol>li>ul a,
#location li .submenu a{display:block;}
#location li.select a{font-weight:500; color:#2f5cbd;}
#location .submenu li.select a{color:#7831bf;}
#location .tab,
#location .tab li,
#location .tab li a{display:none; padding:0; margin:0;}

#contents{margin-top:70px; margin-bottom:70px;}
#detail_con img{max-width:100%;}

#detail_con a.golink {padding-left:18px; background:url('/open_content/support/img/newwindow.gif') no-repeat left center; text-decoration:underline;}
.conbtnBox {text-align:center; margin-top:50px;}
.tbox .conbtnBox {margin-top:30px;}
.conbtn{position:relative; overflow:hidden; display:inline-block; text-align:center; padding:13px 30px; color:#7731be; border:2px solid #7731be; font-size:1.1em; transition:.3s; z-index:1;}
.conbtn:hover{color:#fff !important;}
.conbtn:before{content:''; position:absolute; top:0; left:0; width:150%; height:100%; transform:rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0); transform-origin:0% 100%; transition:transform 0.3s, opacity 0.3s, background-color 0.3s; z-index:-1;}
.conbtn.bg2{color:#2f5cbd; border-color:#2f5cbd;}
.conbtn:hover:before{opacity:1; background:#7731be; transform:rotate3d(0, 0, 1, 0deg); transition-timing-function:cubic-bezier(0.2, 1, 0.3, 1);}
.conbtn.bg2:hover:before{background:#2f5cbd;}
.consbtn{display:inline-block; padding:2px 13px 4px 13px; font-size:14px; line-height:22px; border:1px solid #333; border-radius:30px; background-color:#fff; transition:.3s;}
.consbtn:first-child{margin-top:0;}
.consbtn:hover{color:#fff; background-color:#2f5cbd; border-color:#2f5cbd; text-decoration:none; transition:.3s;}
.consbtn.bg2:hover{background-color:#7731be; border-color:#7731be;}
.conbtnBox>a+a {margin-left:10px;}

.tab{margin-bottom:35px; text-align:center;}
.tab li{display:inline-block; transition:.5s;}
.tab li a{position:relative; display:block; padding:10px 25px; font-size:1.1em;}
.tab li.select,
.tab li:hover{border-radius:5px; background-color:#7731be;}
.tab li:hover{background-color:#38098e;}
.tab li.select a,
.tab li:hover a{color:#fff; font-weight:600;}
.stab{padding:2%; margin-bottom:30px; border-radius:10px; background-color:#f5f5f5;}
.stab li{margin:1% .5%; background-color:#FFF;}

.tab.ic li{min-width:100px;}
.tab.ic li a{padding-top:75px; padding-bottom:20px;}
.tab.ic li a:before{content:''; position:absolute; left:50%; top:15px; margin-left:-23px; width:46px; height:48px; background-repeat:no-repeat; transition:.3s;}
.tab.ic li.long a{padding-left:5px; padding-right:5px;}
.tab.ic li.ic01 a:before{background-position-x:0;}
.tab.ic li.ic02 a:before{background-position-x:-46px;}
.tab.ic li.ic03 a:before{background-position-x:-92px;}
.tab.ic li.ic04 a:before{background-position-x:-138px;}
.tab.ic li.ic05 a:before{background-position-x:-184px;}
.tab.ic li.ic06 a:before{background-position-x:-230px;}
.tab.ic li.ic07 a:before{background-position-x:-276px;}
.tab.ic li.select a:before,
.tab.ic li:hover a:before{background-position-y:bottom;}
.tab.business li a:before{background-image:url('/open_content/support/img/sub/tab_business.png');}
.tab.factory li a:before{background-image:url('/open_content/support/img/sub/tab_factory.png');}
.tab.email li a:before{background-image:url('/open_content/support/img/sub/tab_email.png');}
.tab.magazine li a:before{background-image:url('/open_content/support/img/sub/tab_magazine.png');}

.wfont{font-weight:500;}

.para_line{margin-top:80px; border-top:1px solid #ddd;}
.para_line:nth-of-type(1){border:none;}

.para01{margin-left:10px; margin-top:60px}
h4{position:relative; padding-left:50px; margin-top:80px;font-size:2em; font-weight:500;}
h4:after{content:''; position:absolute; left:10px; top:14px; width:20px; height:20px; border-radius:100%; background:#fff; z-index:2;}
h4:before{content:''; position:absolute; left:0; top:0; margin-top:4px; margin-right:15px; width:40px; height:40px; border-radius:100%; background:linear-gradient(to right, #2f5cbc, #7866fa); z-index:1;}
#detail_con>h4:first-child, #detail_con>.stab+h4{padding-top:0; border-top:none;}
.bl02{color:#7831bf; margin-bottom:20px; font-size:1.5em; font-weight:500}
.bl02:before{display:inline-block; content:''; vertical-align:top; margin-top:9px; margin-right:7px; width:8px; height:8px; border:5px solid #7831bf; border-radius:100%;}
.bl03{margin-left:14px}
.bl03:not(ul), .bl03>li{position:relative; padding-left:12px; margin-bottom:10px; font-size:1.1em; font-weight:300; word-break:keep-all}
.bl03:not(ul):before, .bl03>li:before{display:block; content:''; position:absolute; left:0px; top:9px; width:6px; height:6px; border-radius:100%; background:#333}
.bl04{margin-left:14px}
.bl04:not(ul), .bl04>li{position:relative; padding-left:10px; margin-bottom:8px; font-size:1.05em; word-break:keep-all}
.bl04:not(ul):before, .bl04>li:before{display:block; content:''; position:absolute; left:0px; top:10px; width:5px; height:1px; background:#333}
.bl03+.bl04{margin-left:27px; margin-top:5px}
.bl03 .bl04{margin-left:0; margin-top:10px; margin-bottom:15px}
.bl04+.bl03{margin-top:25px}
.bl03>li:last-child .bl04{margin-bottom:0px}
.nobl:before{display:none !important}

h4+.tbox{margin-top:20px}
.tbox{padding:3% 3.5%; font-size:1.2em; border:none; border-radius:10px; background:#f8f8f8; word-break:keep-all}
.tbox .wfont{margin-bottom:10px; font-size:1.4em;}

.tableBox{margin-top:10px;}
caption{position:absolute; display:block; overflow:hidden; text-indent:-5000px; font-size:0; line-height:0; width:1px; height:1px;}
table.data{position:relative; width:100%; border-top:2px solid #333; border-spacing:0; border-collapse:collapse; word-break:break-all;}
table.data.nothead{border-top:0;}
table.data.nothead tr:first-child th, table.data.nothead tr:first-child td{border-top:2px solid #000;}
table.data:before{display:block; content:""; position:absolute; left:0; top:-1px; width:1px; height:100%; background:#fff;}
table.data:after{display:block; content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#000;}
table.data th{background:#f8f8f8;}
table.data th, table.data td{text-align:center; padding:15px 18px 15px; font-size:1.05em; font-weight:300; border-bottom:1px solid #ddd; border-left:1px solid #ddd;}
table.data thead th{font-weight:300;}
table.data tr:first-child th:first-child{border-left:none;}
table.data tfoot th{border-left:1px solid #ddd; text-align:center;}
table.data tfoot tr:last-child td{border-bottom:none;}
table.data td:last-child{border-right:0 !Important;}
table.data tbody tr th:first-child, table.data tfoot th:first-child{border-right:1px solid #ddd; border-left:0;}
table.data tbody tr td:first-child{border-left:none; border-right:1px solid #ddd;}

.step{margin-bottom:20px; counter-reset:step;}
.step>li{position:relative; margin-bottom:80px; border:3px solid #ddd; border-radius:5px;}
.step>li:before{content:'STEP 0'counter(step); display:block; text-align:center; width:100%; padding:20px 0; font-size:1.2em; font-weight:400; background-color:#f8f8f8; counter-increment:step;}
.step>li:after{content:''; position:absolute; left:50%; bottom:-65px; display:inline-block; width:40px; height:40px; margin-left:-20px; border-radius:100%; background:#ccc url('/open_content/support/img/main/control_right.png') 55% center no-repeat; z-index:1; transform:rotate(90deg);}
.step>li:nth-last-of-type(1):after{display:none;}
.step>li:first-child{border-color:#2f5cbd;}
.step>li:first-child:after{background-color:#2f5cbd;}
.step>li:first-child:before{color:#fff; background-color:#2f5cbd;}
.step>li:nth-last-of-type(1){border-color:#7731be;}
.step>li:nth-last-of-type(2):after{background-color:#7731be;}
.step>li:nth-last-of-type(1):before{color:#fff; background-color:#7731be;}
.step>li>p{display:block; text-align:center; vertical-align:middle; padding:48px 15px; border-top:none; font-size:1.1em; border-radius:0 0 5px 5px;}
.step>li>p.row{padding-top:25px; padding-bottom:25px;}
.step>li>p>a{margin-top:15px;}

.step02{display: flex; gap:15px; counter-reset:step;}
.step02>li{flex:1; position:relative; margin-bottom:80px; border:3px solid #ddd; border-radius:5px; word-break: keep-all;}
.step02>li:before{content:'STEP 0'counter(step); display:block; text-align:center; width:100%; padding:20px 0; font-size:1.2em; font-weight:400; background-color:#f8f8f8; counter-increment:step;}
.step02>li:after{content:''; position:absolute; left:calc(100% - 3px); top:50%; display:inline-block; width:40px; height:40px; margin-left:-20px; border-radius:100%; background:#ccc url('/open_content/support/img/main/control_right.png') 55% center no-repeat; z-index:1; transform:scale(0.8);}
.step02>li:nth-last-of-type(1):after{display:none;}
.step02>li:first-child{border-color:#2f5cbd;}
.step02>li:first-child:after{background-color:#2f5cbd;}
.step02>li:first-child:before{color:#fff; background-color:#2f5cbd;}
.step02>li:nth-last-of-type(1){border-color:#7731be;}
.step02>li:nth-last-of-type(2):after{background-color:#7731be;}
.step02>li:nth-last-of-type(1):before{color:#fff; background-color:#7731be;}
.step02>li>p{display:block; text-align:center; vertical-align:middle; padding:48px 15px; border-top:none; font-size:1.1em; border-radius:0 0 5px 5px;}
.step02>li>p.row{padding-top:25px; padding-bottom:25px;}
.step02>li>p>a{margin-top:15px;}
.step02>li>div{padding:1em 1.5em}
.step02 a{line-height: 130%; margin:1px}


/*contents*/
.s_txt{color:#666; font-size:.95em !important;}
.visit:before,
.visit:after,
.email_box div.txt:before,
.email_box div.txt:after{content:''; position:absolute; left:0; top:0; width:100%; height:100%;}
.visit:after,
.email_box div.txt:after{ background-image:url('/open_content/support/img/sub/visit_Lbg.png'), url('/open_content/support/img/sub/visit_Rbg.png'); background-position:left bottom, right top; background-repeat:no-repeat; z-index:1;}

.visit{position:relative; margin-bottom:20px; padding:8%; border-radius:10px; background:linear-gradient(to right, #0889d7, #5052bd); overflow:hidden;}
.visit:before{background:url('/open_content/support/img/sub/visit_bg.png') right 3% bottom no-repeat; z-index:2;}
.visit .txt{width:50%; justify-content:center; z-index:3;}
.visit+.conbtnBox{margin-bottom:80px; margin-top:80px;}
.visit+.conbtnBox a{padding-left:40px; padding-right:40px;}

.apply_close{padding:2%; border-radius:10px; border:3px solid #ddd;}
.apply_close .tit{text-align:center; margin-bottom:30px; padding:2% 0;; font-size:2em; background-color:#f8f8f8;}
.apply_close .tit:before{display:none;}
.apply_close .tit span{position:relative; bottom:0; display:block; width:50px; height:50px; margin:0 auto 15px auto; border:3px solid #333; border-radius:100%;}
.apply_close .tit span:after,
.apply_close .tit span:before{content:''; position:absolute; right:0; top:0; width:3px; height:25px; margin-right:20px; margin-top:10px; border-radius:30px; background-color:#333;}
.apply_close .tit span:before{-webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.apply_close .tit span:after{-webkit-transform:rotate(45deg); transform:rotate(45deg);}

.email_box{position:relative; display:table; margin:4% auto 0%; width:98%; border:1px solid #ddd; border-radius:5px; box-shadow:0px 1px 2px rgba(0,0,0,.1); overflow:hidden;}
.email_box div.txt{position:relative; text-align:center; width:48%; height:100%; padding-top:5%;background:linear-gradient(to right, #0889d7, #5052bd);}
.email_box div.txt img{padding-left:20px;}
.email_box div.txt:before{background:url('/open_content/support/img/sub/email_bg.png') center bottom no-repeat; z-index:2;}
.email_box div.con{width:52%; padding:5% 4% 5% 4%;}
.email_box div.con .board_write input[type="text"], .email_box div.con .board_write input[type=password]{width:96% !important;}
.email_box div.con .board_write>li{border-top:none;}
.email_box div.con .board_write>li dt { display:table-cell; padding-left:1%; padding-right:2%; min-width:120px; width:25%; text-align:left; vertical-align:middle;}
.email_box div.con .board_write>li dd { display:table-cell; padding-right:1%; vertical-align:middle; }
.email_box div.con .board_write>li dt label{font-size:1em;}
.email_box div.con .board_write>li dl.mail{margin-top:10px;}
.email_box div.con .board_write>li dl.mail input[type="text"]{width:45% !important;}
.email_box div.con .board_write>li dl.mail span{margin-left:1%; margin-right:1%;}
.email_box.cancel{max-width:1000px; padding:5%; margin-bottom:40px;}
.email_box.cancel .txt{position:relative; text-align:center; font-size:3em;}
.email_box.cancel .txt:after{content:''; display:block; margin:30px auto 30px auto; width:1px; height:100px; background:#333;}
.email_box.cancel .board_write{margin:auto; max-width:90%;}

.site li{position:relative; display:inline-block; vertical-align:top; text-align:center; width:31%; height:430px; margin:1%; border:3px solid #ddd; border-radius:5px; overflow:hidden;  background-color:#f8f8f8;}
.site li .img{height:150px; padding:55px 30px; margin:auto; background-color:#FFF; overflow:hidden;}
.site li .img img{max-width:250px;}
.site li>div{padding:30px;}
.site li .tit{margin-bottom:15px; font-size:2em;}
.site li .txt{margin-bottom:50px;}
.site li .conbtn{position:absolute; bottom:40px; left:50%; transform:translateX(-50%);}

.seogu{margin-top:25px;}
.seogu li{position:relative; display:inline-block; text-align:center; width:32%; margin-left:1.5%;}
.seogu li:before{content:''; position:absolute; right:-30px; top:50%; display:inline-block; width:40px; height:40px; border-radius:100%; background:#ccc url('/open_content/support/img/main/control_right.png') 55% center no-repeat; z-index:1;}
.seogu li:nth-last-of-type(1):before{display:none;}

.seogu li .img{max-width:415px; margin:auto; line-height:0; border:1px solid #ddd; border-radius:5px; overflow:hidden;}
.seogu li .txt{margin-top:20px; font-size:1.2em; font-weight:500;}

/*pc*/
@media all and (min-width:801px){
	#detail_con{min-height:600px; padding-bottom:5%;}
	.float_box{display:table; width:100%; margin-top:80px; border-top:1px solid #ddd;}
	.float_box:first-child{margin-top:70px; border-top:none;}
	.float_box:first-child h4{margin-top:0;}
	.float_box .step,
	.float_box .para_line{display:table-cell; width:48%; border-top:none;}
	.float_box .step:nth-child(even),
	.float_box .para_line:nth-child(even){padding-left:2%;}
	.float_box .step:nth-child(odd),
	.float_box .para_line:nth-child(odd){padding-right:2%;}
	.visit{display:flex; margin-top:100px; min-height:400px; align-items:center;}
	.email_box{display:table;}
	.email_box div.txt,
	.email_box div.con{display:table-cell;}
	.email_box div.txt p{position:absolute; left:0; right:0; top:10%; padding-left:20px;}
	.email_box:after{display:block; content:''; position:absolute; left:48%; top:0px; width:1px; height:100%; background:#ddd;}
	.email_box.cancel:after{display:none;}
	.site{margin-top:100px;}
	.seogu li:first-child{margin-left:0;}
}

/*tablet~mobile*/
@media screen and (max-width:800px){
	#con_tit{background-size:cover;}
	#con_tit h3{padding:2% 3% 7%; font-size:2.5em;}
	#con_tit .share{margin-right:0;}
	#con_tit .sns li.print{display:none;}
	#con_tit .share, #con_tit .sns{right:3%;}
	#con_tit .sns{z-index:2;}
	#location ol>li>a{padding-left:15px; padding-right:65px; font-size:1.1em;}
	#location ol>li>a:after{right:15px;}
	#contents{padding-left:3%; padding-right:3%;}
	.float_box:nth-of-type(1) .para_line:nth-of-type(1){border-top:0;}
	.float_box .para_line{border-top:1px solid #ddd;}
	.step>li>p{padding:15px;}

	.visit:before,
	.email_box div.txt:before{background-position:center bottom; background-size:80%;}
	.visit .txt{width:100%; padding:10% 20px 70% 15px; text-align:center;}
	.email_box div.txt,
	.email_box div.con{width:100%;}
	.email_box div.txt p{padding:10% 20px 70% 15px;}
	.email_box div.con .board_write>li dt, .email_box div.con .board_write>li dd{font-size:1em;}
	.site li{width:98%; height:auto; padding-bottom:60px;}
	.site li .img img{max-width:100%;}
	.seogu li{width:98%; margin:0 1% 100px 1%;}
	.seogu li:nth-last-child(1){margin-bottom:0;}
	.seogu li:before{left:50%; top:auto; bottom:-60px; margin-left:-20px; transform:rotate(90deg)}
}

/*mobile_min*/
@media screen and (max-width:480px){
	#location{display:none;}
	.tab li a{padding:5px 10px; font-size:1em;}
	.tab.ic li{min-width:auto;}
	.tab.ic li a{padding:5px 10px;}
	.tab.ic li a:before{display:none;}
	.site li .conbtn{width:80%;}
}