/* ****************** 1칸 레이아웃  ****************** */

.layout_131741_ {clear:both; min-width:320px; max-width:1200px; margin:0 auto;}
.layout_131741_ > div:after {content:''; display:block; clear:both;}
.layout_131741_ > div > [class^=container_] {float:left; position:relative; width:100%; box-sizing:border-box;}

@media \0screen{
	.layout_131741_ {min-width:1200px;}
}

/* ****************** 이미지  ****************** */

.img_131751_ {display:inline-block; overflow:hidden; position:relative; width:px; max-width:100%; vertical-align:top;}
.img_131751_ * {box-sizing:border-box;}
.img_131751_ a {display:block; text-decoration:none;}
.img_131751_ img {max-width:100%; vertical-align:top;}

/* ****************** 공백  ****************** */

.empty_line_131761_ {display:block; width:100%; height:50px; line-height:50px;}

[id^=div_user_list] .empty_line_131761_ {border:1px dotted #f00;}
[id^=div_user_list] .empty_line_131761_:before {content:'공백 : 50px'; padding:0 15px; font-size:13px; font-weight:normal; color:#f00;}

/* ****************** 4칸 레이아웃_테두리  ****************** */

.layout_106087_ {clear:both; min-width:320px; max-width:1200px; margin:0 auto;}
.layout_106087_ > div {margin-left:-10px;}
.layout_106087_ > div:after {content:''; display:block; clear:both;}
 
.layout_106087_ > div > [class^=container_] {float:left; position:relative; width:90%; padding-left:10px; box-sizing:border-box;}
.layout_106087_ > div > [class^=container_] > div {border:1px solid #DDDDDD;background:#ffffff;}
 
.layout_106087_ > div > .container_1 {width:25%;}
.layout_106087_ > div > .container_2 {width:25%;}
.layout_106087_ > div > .container_3 {width:25%;}
.layout_106087_ > div > .container_4 {width:25%;}
 
@media (max-width:1023px){
.layout_106087_ > div > .container_1 { width:50%; }
.layout_106087_ > div > .container_2 { width:50%; }
.layout_106087_ > div > .container_3 {clear:both; width:50%; padding-top:10px;}
.layout_106087_ > div > .container_4 { width:50%; padding-top:10px;}
}
 
@media \0screen{
.layout_106087_ {min-width:1200px;}
}

/* ****************** 이미지 리스트확대 (타일형)  ****************** */

.img_tile_465240_:after {content:''; display:block; clear:both;}
.img_tile_465240_ * {box-sizing:border-box;}
.img_tile_465240_ .item {float:left; position:relative; display:block; height:100%; width:100%; padding:10px; border:0px solid #ddd;}
.img_tile_465240_ .item a {display:block; text-decoration:none;}
.img_tile_465240_ figure {display:block; margin:0;overflow:hidden; }
.img_tile_465240_ figure img {max-width:100%; vertical-align:bottom; transform:scale(1.0); transition:transform .5s; }
.img_tile_465240_ figure img:hover {transform:scale(1.1); transition:transform .5s;}
.img_tile_465240_ .text_box {display:block;}
.img_tile_465240_ .text_box p {margin:0; padding:5px 10px;;}
.img_tile_465240_ .subject {font-weight:; color:#000000;}
.img_tile_465240_ .content {color:#666; text-align:left;}

.text_sml_465240_ .subject {font-size:14px; line-height:1.6em;}
.text_sml_465240_ .content {font-size:13px; line-height:1.6em;}
.text_mid_465240_ .subject {font-size:16px; line-height:1.4em;}
.text_mid_465240_ .content {font-size:14px; line-height:1.6em;}
.text_big_465240_ .subject {font-size:24px; line-height:1.4em;}
.text_big_465240_ .content {font-size:16px; line-height:1.6em;}

.col_m_1_465240_ .item {width:100%;}
.col_m_2_465240_ .item {width:50%;}
.col_m_3_465240_ .item {width:33.3333%;}
.col_m_1_465240_ .item,
.col_m_2_465240_ .item2n,
.col_m_3_465240_ .item3n {clear:both;}

@media (min-width:1024px){
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

@media \0screen{
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

/* ****************** 타이틀 텍스트  ****************** */

.title_131801_ {font-size:0;}
.title_131801_ p {
	display:inline-block; position:relative; margin:0; padding:0;
	font-size:20px; letter-spacing:-1px; font-weight:bold; color:#000000; line-height:1.4em;
}
.title_131801_ p:before {content:''; position:absolute; background:#d00000; font-size:0;}

.title_131801_.style_top p {padding-top:10px;}
.title_131801_.style_top p:before {left:0; top:0; width:20px; height:4px;}

.title_131801_.style_right p {padding-right:14px;}
.title_131801_.style_right p:before {right:0; top:4px; width:4px; height:20px;}

.title_131801_.style_bottom p {padding-bottom:12px;}
.title_131801_.style_bottom p:before {left:0; bottom:0; width:20px; height:4px;}

.title_131801_.style_left p {padding-left:14px;}
.title_131801_.style_left p:before {left:0; top:4px; width:4px; height:20px;}

.title_131801_.style_circle1 p {padding-left:20px;}
.title_131801_.style_circle1 p:before {
	left:0; top:8px; width:12px; height:12px;
	border-radius:12px;
}

.title_131801_.style_circle2 p {padding-left:20px;}
.title_131801_.style_circle2 p:before {
	left:0; top:8px; width:12px; height:12px;
	border:2px solid #d00000; border-radius:12px; background:none; box-sizing:border-box;
}

/* ****************** 장문 텍스트  ****************** */

.textarea_131811_ p {
	display:block; margin:0; padding:0;
	font-size:13px; letter-spacing:0px; font-weight:normal; color:#777777; line-height:1.6em;
}

/* ****************** 이미지 리스트확대 (타일형)  ****************** */

.img_tile_465240_:after {content:''; display:block; clear:both;}
.img_tile_465240_ * {box-sizing:border-box;}
.img_tile_465240_ .item {float:left; position:relative; display:block; height:100%; width:100%; padding:10px; border:0px solid #ddd;}
.img_tile_465240_ .item a {display:block; text-decoration:none;}
.img_tile_465240_ figure {display:block; margin:0;overflow:hidden; }
.img_tile_465240_ figure img {max-width:100%; vertical-align:bottom; transform:scale(1.0); transition:transform .5s; }
.img_tile_465240_ figure img:hover {transform:scale(1.1); transition:transform .5s;}
.img_tile_465240_ .text_box {display:block;}
.img_tile_465240_ .text_box p {margin:0; padding:5px 10px;;}
.img_tile_465240_ .subject {font-weight:; color:#000000;}
.img_tile_465240_ .content {color:#666; text-align:left;}

.text_sml_465240_ .subject {font-size:14px; line-height:1.6em;}
.text_sml_465240_ .content {font-size:13px; line-height:1.6em;}
.text_mid_465240_ .subject {font-size:16px; line-height:1.4em;}
.text_mid_465240_ .content {font-size:14px; line-height:1.6em;}
.text_big_465240_ .subject {font-size:24px; line-height:1.4em;}
.text_big_465240_ .content {font-size:16px; line-height:1.6em;}

.col_m_1_465240_ .item {width:100%;}
.col_m_2_465240_ .item {width:50%;}
.col_m_3_465240_ .item {width:33.3333%;}
.col_m_1_465240_ .item,
.col_m_2_465240_ .item2n,
.col_m_3_465240_ .item3n {clear:both;}

@media (min-width:1024px){
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

@media \0screen{
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

/* ****************** 타이틀 텍스트  ****************** */

.title_131831_ {font-size:0;}
.title_131831_ p {
	display:inline-block; position:relative; margin:0; padding:0;
	font-size:20px; letter-spacing:-1px; font-weight:bold; color:#000000; line-height:1.4em;
}
.title_131831_ p:before {content:''; position:absolute; background:#d00000; font-size:0;}

.title_131831_.style_top p {padding-top:10px;}
.title_131831_.style_top p:before {left:0; top:0; width:20px; height:4px;}

.title_131831_.style_right p {padding-right:14px;}
.title_131831_.style_right p:before {right:0; top:4px; width:4px; height:20px;}

.title_131831_.style_bottom p {padding-bottom:12px;}
.title_131831_.style_bottom p:before {left:0; bottom:0; width:20px; height:4px;}

.title_131831_.style_left p {padding-left:14px;}
.title_131831_.style_left p:before {left:0; top:4px; width:4px; height:20px;}

.title_131831_.style_circle1 p {padding-left:20px;}
.title_131831_.style_circle1 p:before {
	left:0; top:8px; width:12px; height:12px;
	border-radius:12px;
}

.title_131831_.style_circle2 p {padding-left:20px;}
.title_131831_.style_circle2 p:before {
	left:0; top:8px; width:12px; height:12px;
	border:2px solid #d00000; border-radius:12px; background:none; box-sizing:border-box;
}

/* ****************** 장문 텍스트  ****************** */

.textarea_131841_ p {
	display:block; margin:0; padding:0;
	font-size:13px; letter-spacing:0px; font-weight:normal; color:#777777; line-height:1.6em;
}

/* ****************** 이미지 리스트확대 (타일형)  ****************** */

.img_tile_465240_:after {content:''; display:block; clear:both;}
.img_tile_465240_ * {box-sizing:border-box;}
.img_tile_465240_ .item {float:left; position:relative; display:block; height:100%; width:100%; padding:10px; border:0px solid #ddd;}
.img_tile_465240_ .item a {display:block; text-decoration:none;}
.img_tile_465240_ figure {display:block; margin:0;overflow:hidden; }
.img_tile_465240_ figure img {max-width:100%; vertical-align:bottom; transform:scale(1.0); transition:transform .5s; }
.img_tile_465240_ figure img:hover {transform:scale(1.1); transition:transform .5s;}
.img_tile_465240_ .text_box {display:block;}
.img_tile_465240_ .text_box p {margin:0; padding:5px 10px;;}
.img_tile_465240_ .subject {font-weight:; color:#000000;}
.img_tile_465240_ .content {color:#666; text-align:left;}

.text_sml_465240_ .subject {font-size:14px; line-height:1.6em;}
.text_sml_465240_ .content {font-size:13px; line-height:1.6em;}
.text_mid_465240_ .subject {font-size:16px; line-height:1.4em;}
.text_mid_465240_ .content {font-size:14px; line-height:1.6em;}
.text_big_465240_ .subject {font-size:24px; line-height:1.4em;}
.text_big_465240_ .content {font-size:16px; line-height:1.6em;}

.col_m_1_465240_ .item {width:100%;}
.col_m_2_465240_ .item {width:50%;}
.col_m_3_465240_ .item {width:33.3333%;}
.col_m_1_465240_ .item,
.col_m_2_465240_ .item2n,
.col_m_3_465240_ .item3n {clear:both;}

@media (min-width:1024px){
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

@media \0screen{
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

/* ****************** 타이틀 텍스트  ****************** */

.title_131871_ {font-size:0;}
.title_131871_ p {
	display:inline-block; position:relative; margin:0; padding:0;
	font-size:20px; letter-spacing:-1px; font-weight:bold; color:#000000; line-height:1.4em;
}
.title_131871_ p:before {content:''; position:absolute; background:#d00000; font-size:0;}

.title_131871_.style_top p {padding-top:10px;}
.title_131871_.style_top p:before {left:0; top:0; width:20px; height:4px;}

.title_131871_.style_right p {padding-right:14px;}
.title_131871_.style_right p:before {right:0; top:4px; width:4px; height:20px;}

.title_131871_.style_bottom p {padding-bottom:12px;}
.title_131871_.style_bottom p:before {left:0; bottom:0; width:20px; height:4px;}

.title_131871_.style_left p {padding-left:14px;}
.title_131871_.style_left p:before {left:0; top:4px; width:4px; height:20px;}

.title_131871_.style_circle1 p {padding-left:20px;}
.title_131871_.style_circle1 p:before {
	left:0; top:8px; width:12px; height:12px;
	border-radius:12px;
}

.title_131871_.style_circle2 p {padding-left:20px;}
.title_131871_.style_circle2 p:before {
	left:0; top:8px; width:12px; height:12px;
	border:2px solid #d00000; border-radius:12px; background:none; box-sizing:border-box;
}

/* ****************** 장문 텍스트  ****************** */

.textarea_131891_ p {
	display:block; margin:0; padding:0;
	font-size:13px; letter-spacing:0px; font-weight:normal; color:#777777; line-height:1.6em;
}

/* ****************** 이미지 리스트확대 (타일형)  ****************** */

.img_tile_465240_:after {content:''; display:block; clear:both;}
.img_tile_465240_ * {box-sizing:border-box;}
.img_tile_465240_ .item {float:left; position:relative; display:block; height:100%; width:100%; padding:10px; border:0px solid #ddd;}
.img_tile_465240_ .item a {display:block; text-decoration:none;}
.img_tile_465240_ figure {display:block; margin:0;overflow:hidden; }
.img_tile_465240_ figure img {max-width:100%; vertical-align:bottom; transform:scale(1.0); transition:transform .5s; }
.img_tile_465240_ figure img:hover {transform:scale(1.1); transition:transform .5s;}
.img_tile_465240_ .text_box {display:block;}
.img_tile_465240_ .text_box p {margin:0; padding:5px 10px;;}
.img_tile_465240_ .subject {font-weight:; color:#000000;}
.img_tile_465240_ .content {color:#666; text-align:left;}

.text_sml_465240_ .subject {font-size:14px; line-height:1.6em;}
.text_sml_465240_ .content {font-size:13px; line-height:1.6em;}
.text_mid_465240_ .subject {font-size:16px; line-height:1.4em;}
.text_mid_465240_ .content {font-size:14px; line-height:1.6em;}
.text_big_465240_ .subject {font-size:24px; line-height:1.4em;}
.text_big_465240_ .content {font-size:16px; line-height:1.6em;}

.col_m_1_465240_ .item {width:100%;}
.col_m_2_465240_ .item {width:50%;}
.col_m_3_465240_ .item {width:33.3333%;}
.col_m_1_465240_ .item,
.col_m_2_465240_ .item2n,
.col_m_3_465240_ .item3n {clear:both;}

@media (min-width:1024px){
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

@media \0screen{
	.col_m_1_465240_ .item,
	.col_m_2_465240_ .item2n,
	.col_m_3_465240_ .item3n {clear:none;}

	.col_pc_1_465240_ .item {width:100%;}
	.col_pc_2_465240_ .item {width:50%;}
	.col_pc_3_465240_ .item {width:33.3333%;}
	.col_pc_4_465240_ .item {width:25%;}
	.col_pc_5_465240_ .item {width:20%;}
	.col_pc_6_465240_ .item {width:16.6666%;}
	.col_pc_1_465240_ .item,
	.col_pc_2_465240_ .item2n,
	.col_pc_3_465240_ .item3n,
	.col_pc_4_465240_ .item4n,
	.col_pc_5_465240_ .item5n,
	.col_pc_6_465240_ .item6n {clear:both;}
}

/* ****************** 타이틀 텍스트  ****************** */

.title_131881_ {font-size:0;}
.title_131881_ p {
	display:inline-block; position:relative; margin:0; padding:0;
	font-size:20px; letter-spacing:-1px; font-weight:bold; color:#000000; line-height:1.4em;
}
.title_131881_ p:before {content:''; position:absolute; background:#d00000; font-size:0;}

.title_131881_.style_top p {padding-top:10px;}
.title_131881_.style_top p:before {left:0; top:0; width:20px; height:4px;}

.title_131881_.style_right p {padding-right:14px;}
.title_131881_.style_right p:before {right:0; top:4px; width:4px; height:20px;}

.title_131881_.style_bottom p {padding-bottom:12px;}
.title_131881_.style_bottom p:before {left:0; bottom:0; width:20px; height:4px;}

.title_131881_.style_left p {padding-left:14px;}
.title_131881_.style_left p:before {left:0; top:4px; width:4px; height:20px;}

.title_131881_.style_circle1 p {padding-left:20px;}
.title_131881_.style_circle1 p:before {
	left:0; top:8px; width:12px; height:12px;
	border-radius:12px;
}

.title_131881_.style_circle2 p {padding-left:20px;}
.title_131881_.style_circle2 p:before {
	left:0; top:8px; width:12px; height:12px;
	border:2px solid #d00000; border-radius:12px; background:none; box-sizing:border-box;
}

/* ****************** 장문 텍스트  ****************** */

.textarea_131901_ p {
	display:block; margin:0; padding:0;
	font-size:13px; letter-spacing:0px; font-weight:normal; color:#777777; line-height:1.6em;
}

/* ****************** 공백  ****************** */

.empty_line_131911_ {display:block; width:100%; height:50px; line-height:50px;}

[id^=div_user_list] .empty_line_131911_ {border:1px dotted #f00;}
[id^=div_user_list] .empty_line_131911_:before {content:'공백 : 50px'; padding:0 15px; font-size:13px; font-weight:normal; color:#f00;}

/* ****************** 2칸 레이아웃  ****************** */

.layout_131941_ {clear:both; min-width:320px; max-width:1200px; margin:0 auto;}
.layout_131941_ > div {}
.layout_131941_ > div:after {content:''; display:block; clear:both;}
.layout_131941_ > div > [class^=container_] {float:left; position:relative; width:100%;  box-sizing:border-box;}
.layout_131941_ > div > .container_1 {width:50%;}
.layout_131941_ > div > .container_2 {width:50%;}

@media (max-width:1023px){
	.layout_131941_ > div > .container_1 { width:100%; }
	.layout_131941_ > div > .container_2 { width:100%; }
}

@media \0screen{
	.layout_131941_ {min-width:1200px;}
}

/* ****************** 이미지 (테두리 자동그려지기)  ****************** */

.img_ratio_312536_ {display:inline-block; overflow:hidden; position:relative; width:%; max-width:100%; vertical-align:top;}
.img_ratio_312536_ * {box-sizing:border-box;}
.img_ratio_312536_ a {display:block; text-decoration:none;}
.img_ratio_312536_ img {width:100%; vertical-align:top;}
  
 /* 본 소스는 %(퍼센트)로 되어있기 때문에 반응형에 적용할 수 있습니다 */
* {margin:0;padding:0;}
.img_ratio_312536_ {position:relative;display:inline-block;}
.img_ratio_312536_ img {max-width:100%;}
.img_ratio_312536_ span.text {position:absolute;top:50%;left:0;transform:translateY(-50%);display:none;width:100%;font-size:70px;color:#fff;font-weight:900;text-align:center;}
.img_ratio_312536_::before, .img_ratio_312536_::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:all .8s;-webkit-transition:all .8s;}
.img_ratio_312536_::before {width:97%;height:95%;border-top:2px solid #fff;border-bottom:2px solid #fff;width:0;} /* 보더의 두께가 있기 때문에 요소의 크기에 계산해 줘야 합니다 */
.img_ratio_312536_::after {width:97%;height:95%;border-left:2px solid #fff;border-right:2px solid #fff;height:0;} /* 보더의 두께가 있기 때문에 요소의 크기에 계산해 줘야 합니다 */

/* 마우스가 올라가면 반응하는 소스 */
.img_ratio_312536_:hover span.text {display:block;}
.img_ratio_312536_:hover::before {width:calc(97% + 4px);} /* 화면에 따라서 정확한 사각형을 위한 값을 줘야하는 부분 */
.img_ratio_312536_:hover::after {height:calc(95% + 4px);} /* 보더의 두께값을 더해줘서 정확한 모서리를 만들기 위해 calc값을 사용했습니다 */
  
  
  
@media (min-width:1024px){
	.img_ratio_312536_ {width:px;}
}
@media \0screen{
	.img_ratio_312536_ {width:px;}
}

/* ****************** 이미지 (테두리 자동그려지기)  ****************** */

.img_ratio_312536_ {display:inline-block; overflow:hidden; position:relative; width:%; max-width:100%; vertical-align:top;}
.img_ratio_312536_ * {box-sizing:border-box;}
.img_ratio_312536_ a {display:block; text-decoration:none;}
.img_ratio_312536_ img {width:100%; vertical-align:top;}
  
 /* 본 소스는 %(퍼센트)로 되어있기 때문에 반응형에 적용할 수 있습니다 */
* {margin:0;padding:0;}
.img_ratio_312536_ {position:relative;display:inline-block;}
.img_ratio_312536_ img {max-width:100%;}
.img_ratio_312536_ span.text {position:absolute;top:50%;left:0;transform:translateY(-50%);display:none;width:100%;font-size:70px;color:#fff;font-weight:900;text-align:center;}
.img_ratio_312536_::before, .img_ratio_312536_::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:all .8s;-webkit-transition:all .8s;}
.img_ratio_312536_::before {width:97%;height:95%;border-top:2px solid #fff;border-bottom:2px solid #fff;width:0;} /* 보더의 두께가 있기 때문에 요소의 크기에 계산해 줘야 합니다 */
.img_ratio_312536_::after {width:97%;height:95%;border-left:2px solid #fff;border-right:2px solid #fff;height:0;} /* 보더의 두께가 있기 때문에 요소의 크기에 계산해 줘야 합니다 */

/* 마우스가 올라가면 반응하는 소스 */
.img_ratio_312536_:hover span.text {display:block;}
.img_ratio_312536_:hover::before {width:calc(97% + 4px);} /* 화면에 따라서 정확한 사각형을 위한 값을 줘야하는 부분 */
.img_ratio_312536_:hover::after {height:calc(95% + 4px);} /* 보더의 두께값을 더해줘서 정확한 모서리를 만들기 위해 calc값을 사용했습니다 */
  
  
  
@media (min-width:1024px){
	.img_ratio_312536_ {width:px;}
}
@media \0screen{
	.img_ratio_312536_ {width:px;}
}