/* 공통 */
.con_wrap { width:1300px; margin:0 auto; }
.sub_title { line-height: 1; text-align: center; margin-bottom: 60px; }
.sub_title h1 { font-size:60px; font-weight: 600; font-family: 'Oxanium', cursive; }

#bu1 { padding:50px 0 0; position:relative; z-index: 1; overflow: hidden; line-height: 1; }
.bg_bot { width:100%; height:500px; background:url('../img/bu1_bg.jpg') no-repeat center / cover; }

/*  contents */
.bu1_con { padding:0 0 120px; }
.bu1_con ul { display:flex; justify-content: space-between; }
.bu1_con ul li { position:relative; width:410px; height: 450px; padding:80px 35px 0; border:1px solid #ddd; text-align: center; }
.bu1_con ul li:before { content:""; position:absolute; left:-1px; width:calc(100% + 2px); top:-1px; height:calc(100% + 2px); border:3px solid #1a1a26; transition: all .3s; opacity: 0; }

.bu1_con li .ico { height: 85px; line-height: 85px; }
.bu1_con li .ico img { transition: all .5s; }
.bu1_con li h2 { margin:35px 0 20px; font-size:18px; color:#0888f0; font-family: 'Oxanium', cursive; }
.bu1_con li h3 { font-size:30px; font-family: 'EliceDigitalBaeum_Bold'; }
.bu1_con li p { margin-top: 25px; font-size:17px; font-weight: 300; line-height: 30px; }

/* hover */
.bu1_con ul li:hover:before { opacity: 1; }
.bu1_con li:hover .ico img { transform: rotateY(180deg);}