@charset "utf-8";
/*콘텐츠 공통*/
/* UL, OL, DL */
* html ul li {height:1%; }

ul.basic { margin:10px 0 10px 2px;}
ul.basic > li {padding:0 0 0 12px; background:url("/layout/images/www/common/ico_li.png") no-repeat left 11px;line-height: 27px;}

ul.basic ul {margin-top:10px;}
ul.basic ul li {padding:0 0 0 12px; background:url("/layout/images/www/common/ico_li.png") no-repeat left 7px;  text-align:justify; margin:3px 0 0; line-height:130%;}

ul.basic ul {margin-top:5px; margin-bottom:10px;}
ul.basic ul > li ul li {padding:0 0 0 12px; background:url("/layout/images/www/common/ico_li_li.png") no-repeat left 8px;  text-align:justify; margin:3px 0 0; line-height:130%;}

ol.basic > li { margin-top:7px; padding-bottom:7px; border-bottom:1px dashed #9e9e9e; counter-increment: counter; line-height:30px; }
ol.basic > li:before{content: counter(counter); display: inline-block; border-radius: 30%; width: 24px; height: 24px; text-align: center; vertical-align: middle; margin: -3px 5px 0 3px; text-indent: -1px; line-height:24px;background: #333;color: #fff;}
ol.basic > li > ul { background-color:#f9f7f3; padding:8px 17px; margin:10px 0; }
ol.basic > li > ul li { background:url("/layout/images/common/ico_li01.png") no-repeat 0px 7px ; padding:0 0 0 10px; }
ol.ol_br > li:before { background-color:#046fd9; border:1px solid #046fd9; color:#fff; }
ol.ol_ye > li:before { background-color:#ffe16c; border:1px solid #ffe16c; }

ol.basic ul {margin-top:20px;margin-bottom: 20px;}
ol.basic ul > li ul li {padding:0 0 0 8px; background:url("/layout/images/common/ico_li02.png") no-repeat left 10px;  text-align:justify; margin:3px 0 0; line-height:130%;}

p.basic { clear:both; text-align:justify; padding:2px 0; margin:12px 0 0 0;line-height: 24px;}
p.line { clear:both; text-align:justify;  margin:12px 0 0 2px; padding:0 0 7px 12px; background:url("/layout/images/www/sub/ulli_bl.gif") no-repeat left 8px; border-bottom:1px dashed #c9c9c9;}


/*박스스타일*/
.bor_box1 {color: #343434;border:1px dashed #d8d8d8; margin-top:13px; padding:20px 30px 10px; margin-bottom:10px; }
.bor_box1 .basic { margin-top:11px;}
.bor_box1 ul.basic li {line-height:26px; background-position:left 9px; padding:0 0 5px 12px;font-size: 15px;}
.bor_box1 .title {width: 100px;display: inline-block; padding-right:10px; color:#b2111b;}

.bor_box2 {color: #000;border-top:1px dashed #d8d8d8;border-bottom: 1px dashed #d8d8d8; margin-top:13px; padding:18px; margin-bottom:10px;}
.bor_box2 .basic { margin-top:11px;}
.bor_box2 ul.basic li {line-height:20px; background-position:left 9px; padding:0 0 0 12px;}

.write_form {margin:50px auto;}
table .pw01{ margin-right:20px;}
table .board_button{ margin-left:20px;}

/*다운로드 버튼*/
a.btst { text-align:center; padding:10px 50px; color:#fff; display:inline-block; position:relative; transition: background-color .2s; webkit-transition:-webkit-transform background-color .2s; -moz-transition:-moz-transform background-color .2s; font-size:15px;}

a.btn1 {border: 2px solid #424242;background-color:#fff;color: #424242;text-transform:uppercase;padding:8px 70px;}
.btn1 span { position:relative; transition:color .25s ease-out; -webkit-transition:color .5s ease-out; -moz-transition:color .5s ease-out;}
.btn1:hover span { color:#fff;}
.btn1 .btn1hover1 { position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:#424242; border-right:1px solid #424242; transform:scale(1,0); -webkit-transform:scale(1,0); -moz-transform:scale(1,0); -ms-transform:scale(1,0); transform-origin:center top; -webkit-transform-origin:center top; -moz-transform-origin:center top; -ms-transform-origin:center top; transition:all .2s ease-out; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out;}
.btn1:hover .btn1hover1 { transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -ms-transform:scale(1,1);}

#content a.btn2 {border: 2px solid #3c3c3c;background-color:#fff;color: #0b3164;text-transform:uppercase;padding:2px 40px;}
.btn2 span { position:relative; transition:color .25s ease-out; -webkit-transition:color .5s ease-out; -moz-transition:color .5s ease-out;}
.btn2:hover span { color:#fff;}
.btn2 .btn2hover2 { position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:#2e5eb2; border-right:1px solid #3e635c; transform:scale(1,0); -webkit-transform:scale(1,0); -moz-transform:scale(1,0); -ms-transform:scale(1,0); transform-origin:center top; -webkit-transform-origin:center top; -moz-transform-origin:center top; -ms-transform-origin:center top; transition:all .2s ease-out; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out;}
.btn2:hover .btn2hover2 { transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -ms-transform:scale(1,1);}

#content a.btn3 {background-color: #b53940;}
#content a.btn3:hover { background-color:#2c2c2c;}

#content a.btn5 {background-color: #fff;color: #3e635c;	text-transform: uppercase;	padding: 13px 70px;	text-align: center;	border: 1px solid #3e635c}
#content a.btn5:hover {	background-color: #4c3771;	color: #fff;	border: 1px solid #4c3771;}
#content a.btn5 span.i_down {	background: url("/layout/images/www/common/i_down_s.png") no-repeat scroll 0 8px;	padding: 0 0 0 22px}
#content a.btn5:hover span.i_down {	background: url("/layout/images/www/common/i_down_sh.png") no-repeat scroll 0 5px}

/*이미지정렬*/
ul.img_col2 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 2개*/
ul.img_col2 li { float:left; display: inline-block; text-align: center; width: 49%; height:310px; padding-left:9px; }
ul.img_col2 li img { width:100%; height:auto; max-width:530px;}

ul.img_col2 li { position:relative;}
ul.img_col2 li span.photo_name1 { display:block; width:100%; background: url("/layout/images/www/common/op70.png") repeat 0 0; text-align:center; position:absolute; bottom:0px; height:45px; line-height:45px; color:#fff;}

ul.img_col2_2 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 2개*/
ul.img_col2_2 li { float:left; display: inline-block; text-align: center; width: 49%; height:310px; padding-left:9px; }
ul.img_col2_2 li img { width:100%; height:auto; max-width:530px;}


ul.img_col3 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 3개*/
ul.img_col3 li {display: inline-block; text-align: center; width: 31.5%; margin-right:2.75%; float:left; box-sizing: border-box; }
ul.img_col3 li img { width:100%; height:auto;}
ul.img_col3 li:last-child {margin-right:0;}

ul.img_col3 li { position:relative;}
ul.img_col3 li span.photo_name { display:block; width:100%; background: url("/layout/images/www/common/op70.png") repeat 0 0; text-align:center; position:absolute; bottom:0px; height:40px; line-height:40px; color:#fff;}
ul.img_col3 li span.photo_name1 { display:block; width:100%; text-align:center; bottom:0px; height:40px; line-height:40px; color:#444; border-bottom:1px solid #ccc;font-size: 18px;}

ul.img_col4 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 3개*/
ul.img_col4 li { position:relative}
ul.img_col4 li {display: inline-block; text-align: center; width: 23.333%; margin-right:2.0%; float:left; }
ul.img_col4 li img { width:100%; height:auto; max-width:300px;}
ul.img_col4 li:nth-child(4n) { margin-right: 0;}
ul.img_col4 li span.photo_name { display:block; width:100%; background: url("/layout/images/www/common/op70.png") repeat 0 0; text-align:center; position:absolute; bottom:0px; height:40px; line-height:40px; color:#fff;}

ul.img_col5 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 3개*/
ul.img_col5 li { position:relative}
ul.img_col5 li {display: inline-block; text-align: center; width: 18.333%; margin-right:2.0%; float:left; }
ul.img_col5 li img { width:100%; height:auto; max-width:300px;}
ul.img_col5 li:nth-child(5n) { margin-right: 0;}
ul.img_col5 li span.photo_name { display:block; width:100%; background: url("/layout/images/www/common/op70.png") repeat 0 0; text-align:center; position:absolute; bottom:0px; height:40px; line-height:40px; color:#fff;}

ul.img_col6 li span.photo_name1 { display:block; width:100%; text-align:center; bottom:0px; height:40px; line-height:40px; color:#444; border-bottom:1px solid #ccc;font-size: 18px;}
ul.img_col6 { margin:20px 0 20px; width: 100%; display:inline-block;} /* 이미지 3개*/
ul.img_col6 li {display: inline-block; text-align: center; width: 31.5%; margin-right:2.75%; float:left; }
ul.img_col6 li img { width:100%; height:auto;}
ul.img_col6 li:nth-child(3n) { margin-right: 0;}
ul.img_col6 li span.photo_name { display:block; width:100%; background: url("/layout/images/www/common/op70.png") repeat 0 0; text-align:center; position:absolute; bottom:0px; height:40px; line-height:40px; color:#fff;}
ul.img_col6 li span.photo_name1 { display:block; width:100%; text-align:center; bottom:0px; height:40px; line-height:40px; color:#444; border-bottom:1px solid #ccc;font-size: 16px;}

 
/*좌우 이미지-텍스트 
----------------------------------------*/
.img_txt {clear:both; width:100%; display:inline-block; }
.img_txt img { width:100%;/*border: 1px solid #ccc;*/}

/*80%/80%*/
.img_txt .left20 { width:20%; float:left;}
.img_txt .right80 { float:left; width:75%; padding-left:4%;}

/*30%/70%*/
.img_txt .left30 { width:30%; float:left;}
.img_txt .right70 { float:left; width:66%; padding-left:4%;}

/*40%/60%*/
.img_txt .left40 { width:40%; float:left;}
.img_txt .right60 { float:left; width:56%; padding-left:4%;}

/*50%/50%*/
.img_txt .left50 { width:48%; float:left;}
.img_txt .right50 { float:left; width:49%; padding-left:2%;}

/*80%/20%*/
.img_txt .left80 { width:76%; float:left; padding-right:4%;}
.img_txt .right20 { float:left; width:20%; }

/*60%/40%*/
.img_txt .left60 { width:56%; float:left; padding-right:3%;}
.img_txt .right40 { float:left; width:40%; }
.img_txt .right40 > div { border:1px solid #ccc; text-align:center }
.img_txt .right40 > img { margin:0 !important ;}

/*70%/30%*/
.img_txt .left70 { width:66%; float:left;}
.img_txt .right30 { float:left; width:30%; padding-left:4%;}


/*Table  */
table.table_a {clear:both;width:100%;margin:20px 0 10px 0;border-top: 2px #3c3c3c solid;border-bottom:1px #d2d2d2 solid;border-collapse:collapse;}
table.table_a thead th {padding: 10px 15px;text-align:center;vertical-align:middle;border-left:1px #d2d2d2 solid;border-right:1px #d2d2d2 solid;border-bottom: 1px solid #344555;font-weight: 400;font-size:18px;}
table.table_a th {padding: 15px;text-align:center;border-left:1px #d2d2d2 solid;border-right:1px #d2d2d2 solid;border-bottom: 1px solid #344555;font-weight: 400;font-size: 16px;}
table.table_a tbody th {text-align:center;border-left:1px #d2d2d2 solid;border-right:1px #bfbfbf solid;border-bottom: 1px solid #d2d2d2;font-weight: 400;font-size: 21px;vertical-align: middle;}
table.table_a td {padding:10px;text-align:center;border-left:1px #d2d2d2 solid;border-right:1px #d2d2d2 solid;border-top:1px #d2d2d2 solid;border-bottom: 0; vertical-align:middle; line-height:21px;}
table.table_a td .c_left { text-align:left; display:block;}

table.table_a td ul.basic { margin-bottom:9px; margin-top:8px;}
table.table_a td ul.basic li {text-align:left;}
table.table_a tr:hover {background-color:#e9f5f3;}
table.table_a td span.data { font-size:28px;font-weight: bold;}

table.table_a tfoot td {background-color:#ececec;}
table.table_a td.btds {background-color:#4c5d78; color:#fff;}

.img_box > img {max-width:100%;}

.brn { border-right:none !important;}
.box_basic{ padding:30px; border:1px solid #2c64ca; background-color:#eefaff; margin-top:30px;}

/* 이미지 글 30*70 */
.powerboss_box .img_left30{width:20%; padding:0 2%; float:left;}
.powerboss_box .txt_right70{width:75%; float:left;}
.powerboss_box h4 { margin-top:0; padding-bottom:10px;}

/*pc줄바꿈*/
span.br {display: block;}

/*폰트컬러*/
.c_or { color:#f04e30;} /*주황색*/
.c_bu { color:#06C;} /*남색*/
.c_gr { color:#067c28;} /*초록색*/
.c_bl { color:#131313;} /*검정*/
.c_red { color:#d70d11;} /*빨강*/
.orange {color:#f96f00;}
.black {color:#000000;}
.white {color:#ffffff;}
.sky_blue {color:#0085c9;}
.blue {color:#0773c7;}
.gray {color:#C2C2C2;}
.gray2 {color:#666;}
.c_color11 {color:#a0184f;}
.c_9a4b6b {color:#a52458;}


/* container ************************************************************************/

/* 인사말 */
.greeting { width:1000px; font-size:19px; margin: 0 auto;}
.greeting p.tit{ text-align:center; font-size:24px; font-weight:500; margin-bottom:80px; color:#000;}
.greeting .tit_big01 { display:block; margin-bottom:45px;font-size:60px; font-weight:700;}
.greeting .basic { line-height:30px; padding-bottom:20px;}

/*회사개요*/
.profile_box {background: url("/layout/images/www/contents/overview_bg01.jpg") no-repeat right -10px; padding:30px 0 40px;}
.profile_box h3 {line-height:30px; margin-top:0;font-size: 32px;}
.profile_box ul { width:60%;border-top: 3px solid #333;}
.profile_box li {border-bottom: 1px dotted #666; padding: 0 0 0 40px;line-height: 60px;}
.profile_box li:last-child {border-bottom:2px solid #ccc;}
.profile_box li span.tit {width:110px; display: inline-block;color:#000;font-weight: 500;}
.profile_box li span.tel {letter-spacing:0.1em;}

/* 사업분야 */
.business_card {display: block; padding-left: 20px; padding-right: 20px; margin-left: -27px; margin-right: -27px;min-height:580px;}
.business_card .card_box{display: block; width: 23%; float: left}
.business_card .card_box .card_border{border: 1px solid #ccc; margin: 7px; padding: 24px 27px; overflow: hidden; position: relative; line-height: normal; min-height:515px;}
.business_card .card_box .card_border > p.system_tit{font-size: 23px !important; font-weight: 600 !important; color: #000;margin: 25px 0 5px; padding-bottom: 7px}
.business_card .card_box .card_border > p::before { display:none;}
.business_card .card_box .system_tit::after{content: ""; display: block; width: 33px; height: 1px; background: #b2b2b2; margin: 12px auto 8px 0}
.business_card .card_box .system_stit {font-size: 16px;color: #036;}
.business_card .card_box .system_text {display: block; padding: 0; font-size: 15px; font-weight: 400; line-height: 1.5; color: #555; letter-spacing: -0.5px;}
.business_card .card_box .six_div.process_div{width: 16.66% !important; margin-right: 0 !important; padding: 0 20px !important}
.business_card .card_box img.svg_icon {margin: 0 auto;display: block;}

/* 산업재산권 */
.industry_area { display:block; }
.industry_list { display:block; margin:0; padding:0; list-style:none; }
.industry_list:after { display:block; content:""; clear:both; }
.industry_list li { display:block; float:left; margin-right:25px; }
.industry_list li:nth-child(6n) { margin-right:0; }
.industry_list li p { display:block; height:92px; line-height:1.3; padding-top:15px; font-size:15px; text-align:center; font-weight:500; }
.industry_list li.last p { height:50px; }

/* 카탈로그 */
.catalog_box { margin: 70px 0; }
.catalog_wrap { width: 100%; margin: 0 auto;}
.catalog_wrap li { display:inline-block;width: 32.333%; text-align:center; }
.catalog_wrap li p.tit { font-size: 20px; }
.catalog_wrap li p.btn_download { width: 100%; margin: -15px auto; font-size: 20px; }
.catalog_wrap li img { padding-left:20px;}
.catalog_wrap li a { color: #333; padding: 10px 115px; transition: all 0.5s ease 0s; border-radius: 50px; display: inline-block; border: 3px solid #a0a0a0; box-sizing: border-box; margin: 0 auto; background: url("/layout/images/www/contents/down.png") no-repeat 300px 12px; }
.catalog_wrap li a:hover { background: #f05a67 url("/layout/images/www/contents/down_h.png") no-repeat 300px 12px !important; color: #fff; border: 3px solid #f05a67; box-sizing: border-box; }

.movie { margin:0 0 5% 0;}
.movie p { display:inline-block; margin-right:45px;}
.movie p:nth-child(3n) { margin-right:0;}
.movie span { display:block; text-align:center;}
.movie iframe {width: 400px;height: 230px;}










/* 일정 */	
.bg_color0 {background: #9a4b6b; color:#fff;}
.bg_color0:hover {background:#65253f;}
.bg_color1 {background: #3c8361; color:#fff;}
.bg_color1:hover {background:#184a32;}
.bg_color2 {background: #3e7299; color:#fff;}
.bg_color2:hover {background:#10314a;}

.bg_color01 {background: #f5e4e7;}
.bg_color02 {background: #d8eeeb;}
.bg_color03 {background: #d8e4ee;}

/* 테이블안 공연 스타일*/
table.table_a ul.play {padding: 5% ;}
table.table_a ul.play li { line-height:25px;}
table.table_a ul.play li.tex1 { font-size:14px;}/*극단*/
table.table_a ul.play li.tex2 a {width: 90%;/*height: 35px;line-height: 34px;*/border: 1px solid #fff;border-radius: 4px;font-size:19px;padding: 1% 0; display:inline-block;border-bottom: 1px solid #fff; background:#FFF; color:#000 !important;}
table.table_a ul.play li.tex2 a span {cursor: pointer;display: inline-block;position: relative;transition: 0.5s;}
table.table_a ul.play li.tex2 a span:after {content: '>';position: absolute;opacity: 0;top: 0;right: -20px;transition: 0.5s;}
table.table_a ul.play li.tex2 a:hover span {padding-right: 25px;}
table.table_a ul.play li.tex2 a:hover span:after {opacity: 1;right: 0;}/*제목*/
table.table_a ul.play li.tex3 { font-size:14px;}/*작가*/
table.table_a ul.play li.tex4 { font-size:16px; color:#FF0; border-bottom: 1px solid #ff0;display: inline;}/*공연시간*/
table.table_a td p.tex5 { padding: 3% 0;font-size:20px; color:#C30;}

table.table_a .font_bg1 {background: linear-gradient(to top, #FFE400 10%, transparent 50%);}

/* 공연순서*/
table.table_a td > ul.order { margin:18px 0;}
table.table_a td > ul.order li { display:inline-block; line-height:28px;}
table.table_a td > ul.order li.tex0 { width:200px;padding-left: 10px; color:#000;} 
table.table_a td > ul.order li.tex4  { color:#000;} 
table.table_a td > ul.order li.tex1 { width:330px;letter-spacing: -0.5px;} 
table.table_a td > ul.order li.tex2 { width:300px;font-size: 17px;color:#000;} 
table.table_a td > ul.order li.tex3 { width:20px; height:20px;line-height: 20px; background:#333; color:#fff; text-align:center; border-radius:4px;padding:5px;} 


/* 공연장안내 *//*지도*/
.theater .map_box { width:30.000%;float:left; }
.theater .map_box h3 { border-bottom:1px solid #333;padding: 0 0 20px;}
.theater .box2 { margin:0 5%;}
.theater .map_box ul { margin:20px 0;}
.theater .map_box li { height:40px; line-height:40px;}
.theater .map_box li.icon01 {padding-left: 35px;background:url("/layout/images/www/common/sprite.png") no-repeat 0 -309px;}
.theater .map_box li.icon02 {padding-left: 35px;background:url("/layout/images/www/common/sprite.png") no-repeat 0 -367px;}


/* 후원사 */
.sponsor .box1 { display:inline-block; margin: 5px;padding:0 65px; border:1px solid #ddd; text-align:center; vertical-align: middle;border-radius: 6px;}
.sponsor .box1 img { width:100%;}



/*예매안내*/
.booking_card { margin-top:40px; height:420px;}
.booking_card .booking_card_in {display: block; width: 31.333%; float: left; box-sizing:border-box; margin-right:34px;}
.booking_card .booking_card_in:last-child {margin-right:0;}
.booking_card .booking_card_in .card_border{ height:450px;border: 0px solid #ccc; margin: 0 ; padding: 24px 27px; overflow: hidden; position: relative; line-height: normal;}
.booking_card .booking_card_in .card_border > h3.tit{font-size: 26px !important; font-weight: 500 !important;margin: 25px 0 5px; padding-bottom: 7px}
.booking_card .booking_card_in .card_border > h3::before { display:none;}
.booking_card .booking_card_in .card_border img { width:100%;}

.booking_card .booking_card_in .tit::after{content: ""; display: block; width: 33px; height: 1px; background: #b2b2b2; margin: 12px auto 8px 0}
.booking_card .booking_card_in .stit { display:inline;font-size: 15px; font-weight: 500; padding-bottom: 2px;}
.booking_card .booking_card_in .tel {display:inline-block; margin-bottom:36px; font-size: 21px; font-weight: 400; line-height: 1.5; color: #000; letter-spacing: -0.5px; background: linear-gradient(to top, #fbff00 50%, transparent 50%);}

/*공연안내
.text_con {width: 100%; position: relative;}
.text_con::before {content: "";position: absolute;top:8px;width: 5px;height:95%;background:#333;}
.text_con div {padding-left: 20px;}
.text_con div span { font-weight:bold;}

.text_con1 {width: 100%; position: relative;}
.text_con1::before {content: "";position: absolute;top:8px;width: 5px;height:95%;background:#333;}
.text_con1 div {padding-left: 20px;}
.pro_width > h3 {display: inline-block;padding: 5px 30px;;color: #fff;border-radius: 0 35px ;background:#333;}
*/


@media screen and (max-width: 768px) {

   .text_con {font-size:0.8em;;}
   .text_con1 {font-size:0.8em;}
   .bor_box1 ul.basic li {font-size: 0.8em; !important;}
   
   .address {font-size: 0.8em;}
   
   
   
}




/*오시는 길*/
.location {position: relative;overflow: hidden;padding: 30px 30px;border: 1px solid #ddd;box-sizing: border-box; margin-top:20px;}
.location .map_txt {overflow:hidden;}
.location .map_txt dl{float:left; margin-right:20px;}
.location .map_txt dt{display:inline-block; font-weight:700;line-height:25px; height:30px; color:#333; box-sizing:border-box;}
.location .map_txt dl.add dt{padding:0 10px 0 24px;}
.location .map_txt dl.tel dt{padding:0 10px 0 25px;}
.location .map_txt dl.fax dt{padding:0 10px 0 30px;}
.location .map_txt dd{display:inline-block;line-height:25px; height:30px; color:#666;}
.location .btn{position:absolute; top:24px; right:20px;}
.location .btn a{display:inline-block; width:60px; height:60px; transition:all 0.3s ease; margin:-1.5px;background:url("/layout/images/www/common/sub_sprite.png") no-repeat -549px -396px;border:2px solid #fff;}
.location .btn a:hover{ border:2px solid #06F;}
.location .btn a span {opacity:0;}




/* 운영규정 */
.regulation { counter-reset:num; padding:0; margin:0; list-style:none;}
.regulation > h5 {counter-reset:ol; background:none; padding:0;}
.regulation > h5:before { content:"제" counter(num)"조 "; counter-increment:num 1;}
.regulation > ol > li:before { content: counter(ol); counter-increment:ol 1; display:inline-block; width:15px; height:15px; border:1px solid #ccc; font-size:12px; border-radius:15px; text-align:center; line-height:15px; margin-right:5px;}

.regulation > ol > li {counter-reset:ol2;}
.regulation > ol > li > ol {  margin-bottom:10px;}
.regulation > ol > li > ol li { font-size:14px;line-height: 22px;line-height: 22px;color:#666;}
.regulation > ol > li > ol li:before { content: counter(ol2)". "; counter-increment:ol2 1; display:inline-block; width:15px; height:15px; font-size:14px; text-align:center; line-height:15px; margin-left:10px;margin: 0 4px 0 18px;}












/* */
.zoom_image {overflow: hidden; display:inline-block; width:100%;}
.zoom_image img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:1.5s;
    -moz-transition:1.5s;
    -ms-transition:1.5s;
    -o-transition:1.5s;
    transition:1.5s;
}
/* img 마우스 오버시*/
.zoom_image:hover img {
    cursor:pointer;
    transform:scale(1.6); /* 마우스 오버시 이미지 크기를 1.1 배만큼 확대 */
    -o-transform:scale(1.6); 
    -moz-transform:scale(1.6);
    -webkit-transform:scale(1.6);
    transition: transform 1.5s;  
    -o-transition: transform 1.5s;
    -moz-transition: transform 1.5s;
    -webkit-transition: transform 1.5s;
    /* 마우스 오버시 이미지가 즉시 커지지 않고 30.5 second 의 시간에 걸쳐 커지는 애니메이션 효과*/
}

/* 갤러리 테두리 */
.bannner { position:relative; display:inline-block;}
.bannner img { max-width:100%;}
.bannner span.text { position:absolute; top:50%; left:0; transform:translate(-50%); display:none; width:100%; font-size:70px; text-align:center;}
.bannner::before, .bannner::after { content:""; position:absolute;top:50%; left:50%; width:95%; height:95%; transform:translate(-50%,-50%); transition:all .8s;}
.bannner::before { border-top:2px solid #fff;border-bottom:2px solid #fff; width:0;}
.bannner::after { border-left:2px solid #fff;border-right:2px solid #fff; width:0;}
.bannner:hover span.text { display:block;}
.bannner:hover::before { width:95%;}
.bannner:hover::after { width:95%;}

/* 에니메이션 */
.animation-from-top3 { -webkit-animation-name: movingPara;
        -webkit-animation-duration: 2s;
        -ms-animation-duration: 2s;
        animation-name: movingPara;
        animation-duration: 2s;
    }
.animation-from-top6 { -webkit-animation-name: movingPara;
        -webkit-animation-duration: 4s;
        -ms-animation-duration: 4s;
        animation-name: movingPara;
        animation-duration: 4s;
    }
@keyframes movingPara {

        from { padding-top: 100%; }
        to { padding-top: 0%; }

    }

