@charset "UTF-8";

:root{
    --mrgn-half: calc(var(--mrgn) / 2);     /*9*/
    --mrgn: 18px;
    --mrgn-x2: calc(var(--mrgn) * 2);  /*36*/
    --mrgn-x4: calc(var(--mrgn) * 4);  /*72*/
    --mrgn-x8: calc(var(--mrgn) * 8); /*144*/
    --mrgn-x16: calc(var(--mrgn) * 16);/*288*/
}

*{scroll-behavior: smooth;}
::selection{ background-color: #fdbf43; color: #fbf094;}

html, body{ font-family: 'Montserrat', sans-serif; max-width: 1920px; margin: 0 auto; position: relative;}


.wrap{}
.ratio{ width: 100%; position: realtive;}
ul,li,ol{ margin: 0; padding:0;}
input, select, option, textarea{font-family: 'Montserrat', sans-serif; text-transform: uppercase;}
.full_img{ width:100%;}
.sections{ position: relative;}


h1,h2,h3{ text-transform: uppercase;}
h1{ font-size: 100px; font-weight: 800;}
h2{ font-size: 72px; font-weight: 600;}
h3{ font-size: 32px; font-weight: 500;}
h4{ font-size: 18px; font-weight: 500;}
h5{ font-size: 14px; font-weight: 400; margin-top: 10px;}
h6{ font-size: 12px;}

.show_trigger{ position: absolute; top: 5px; left: 50%; width: 20px; height: 1px;}
.wait_scroll{}
.section .show_trigger {position: absolute; top: 400px; left: 0; width: 1px; height: 1px;}

.sections .width_con .title_con h3, 
.sections .width_con .title_con h2, 
.sections .width_con .title_con h4, 
.sections .width_con .title_con h5{ opacity: 1; transition: all 750ms ease-out; transform: translateY(0); filter: blur(0);}

.sections .width_con .title_con h3{}
.sections .width_con .title_con h2{ transition-delay: 350ms;}
.sections .width_con .title_con h4{ transition-delay: 700ms;}
.sections .width_con .title_con h5{ transition-delay: 1050ms;}

.sections.wait_scroll .width_con .title_con h3, 
.sections.wait_scroll .width_con .title_con h2, 
.sections.wait_scroll .width_con .title_con h4,
.sections.wait_scroll .width_con .title_con h5{ opacity: 0; transform: translateY(30px); filter: blur(4px);} 

.fixed_bg { position: fixed; top: 50%; left: 50%; width: 100%; height:100vh; max-width: 1920px; transform: translate(-50%, -50%);}
.fixed_bg img{ position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%, -50%);}

.width_con { width: 1200px; margin: 0 auto; padding: calc(var(--mrgn) * 8) 0; position: relative;}
.nopd{ padding: 0;}

.title_con{ margin-bottom: calc(var(--mrgn) * 4);}

.title_con h1{ color: #111;}
.title_con h2{ color: #111;}
.title_con h3{ line-height: .85em; background: linear-gradient(90deg, #fdbf43 30%, #fbf094 70%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block;}
.title_con h4{ color: #111;}
.title_con h5{ line-height: 1.15em; color: #111;}
.title_con h6{}

.title_con.nobt{ margin-bottom: 0;}
.title_con > * { position: relative;}
.title_con.center{text-align: center;}

.title_con.text nobar h4{ color:#fff;}

.title_con h1{ margin-top: calc(var(--mrgn));}
.title_con h2{ margin-top: calc(var(--mrgn));}
.title_con h3{}
.title_con h4{ position: relative; margin-top: calc(var(--mrgn-x2));}
.title_con h5{ margin-top: calc(var(--mrgn) / 2);}
.title_con h6{}

.title_con h4:before{ position: absolute; content:''; top: -19px; width: calc(var(--mrgn) * 2); height: 3px; background: linear-gradient(90deg, #fdbf43 30%, #fbf094 70%); top: calc(var(--mrgn) * -1.25);}
.title_con.center h4:before{ position: absolute; content:''; left: 50%; margin-left: calc(var(--mrgn) * -1); background: linear-gradient(90deg, #fdbf43 30%, #fbf094 70%);}
.title_con.right h4:before { left: auto; right: 0;}


.text_box{ text-align: center;}

/*간격 18px*/
.title_con h1 { margin: 0;}
.title_con h2 { margin: 1px 0 0 0; font-weight: 600;}
.title_con h3 {}
.title_con h4 { margin: 27px 0 0 0;} /*비포 마진탑+height*/
.title_con h5 { margin: 18px 0 0 0;}
/*.text h4*/
.title_con.center h4:before { left: 50%; margin-left: -18px;}


ul.v_con{ width: calc(100% + var(--mrgn-x2)); margin: 0 calc(var(--mrgn) * -1) calc(var(--mrgn-x2) * -1);}

ul.v_con li.cells{ position: relative; display: inline-block; margin: 0 var(--mrgn) var(--mrgn-x2);}
ul.v_con li.cells.box{ border-radius: var(--mrgn); position: relative;}


ul.v_con.two_con{}
ul.v_con.two_con > li.cells{width: calc(50% - var(--mrgn-x2));}
ul.v_con.three_con{}
ul.v_con.three_con > li.cells{width: calc(33.333% - var(--mrgn-x2));}
ul.v_con.four_con{}
ul.v_con.four_con > li.cells{width: calc(25% - var(--mrgn-x2));}
ul.v_con.six_con{}
ul.v_con.six_con > li.cells{width: calc(16.666% - var(--mrgn-x2));}




/*------Loading//------*/
.loading_cover { position: fixed; top: 0; left: 0; background: #f5f5f7; width: 100%; height: 100%; z-index: 99999 !important;}
body.loading .loading_cover { opacity: 1; pointer-events: auto;}
body.loading { overflow: hidden;}

.loading_cover .loading_box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #222222; font-weight: 500; animation: loading 2s ease-in-out infinite;}
.loading_cover .loading_box.done { animation: none;}
@keyframes loading{
    0%   { color: #fdbf43;}
    25%  { color: #222222;}
    50%  { color: #fdbf43;}
    75%  { color: #222222;}
    100% { color: #fdbf43;}
}


/*------header//------*/
#header{ position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 999; transition: all 250ms linear;}

#header,
#header .width_con a.btn_home img,
#header .width_con ul.nav,
#header.on,
#header.on .width_con a.btn_home img,
#header.on .width_con ul.nav{ transition: all 250ms linear;}

#header.on{ width: 1260px; height: 60px; left: 50%; margin: 0 0 0 -630px; margin-top: 10px; background: rgba(255, 255, 255, .85); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: 40px; box-shadow: 0 10px 30px rgba(0, 0, 0, .15);}
#header.on .width_con a.btn_home img{ height: 50px;}
#header.on .width_con ul.nav{ top: 20px;}


#header.on:hover{ background: rgba(255, 255, 255, 1); box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .15);}

#header .width_con{ height: 100%;}
#header .width_con a.btn_home{ position: absolute; top: 50%; transform: translateY(-50%);}
#header .width_con a.btn_home img{ height: 60px;}
#header .width_con ul.nav{ position: absolute; right: -18px; top: 29px;}
#header .width_con ul.nav li{ display: inline-block; margin: 0 18px; margin-top: 3px;}
#header .width_con ul.nav li a{ color: #222; text-decoration: none; font-size: 16px; font-weight: 400; transition: all 150ms linear;}
#header .width_con ul.nav li:hover a{ opacity: 1; color: #fdbf43;}
#header .width_con .nav_con ul.nav li.selected a{/*color: #fdbf43;*/}


/*-----visiual-----*/
#visual.section_01{ position: relative; overflow: hidden; background: #f5f5f7;}
#visual.section_01 .width_con{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#visual.section_01 .width_con .title_con{}
#visual.section_01 .width_con .title_con h3{}
#visual.section_01 .width_con .title_con h1{ font-size: 80px;}
#visual.section_01 .width_con .title_con h4{}
#visual.section_01 .width_con .title_con h5{}


/*-----about-----*/
#about.section_02{background: #fff;}
#about.section_02 .width_con{}
#about.section_02 .width_con .yellow_con{}
#about.section_02 .width_con .yellow_con .v_con.two_con{}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells{ margin: 0;}

#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .character{ position: absolute; top: 0; left: 25%; width: 310px; height: 310px; border-radius: 50%; background: linear-gradient(180deg, #fadd61 30%, #faf39d 70%);}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .character img{position: absolute; width: 280px; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(0);}

#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble{ position: absolute; border-radius: 18px; background: #eee; width: 55px; height: 55px; box-shadow: 0 10px 30px -10px rgba(131, 178, 218, .25);}
#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble:before,
#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble:after{ position: absolute; content: ''; bottom: -0.1rem; height: 1rem; box-shadow: 0 10px 30px -10px rgba(41, 80, 143, .25);}
#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble_1:before{ left: -9px;background: radial-gradient(circle at 6% 26%, transparent 10.5px, #eee 10px); width: 20px;height: 20px; top: 31px;}


#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble_2:before{ left: -9px;background: radial-gradient(circle at 6% 26%, transparent 10.5px, #eee 10px); width: 20px;height: 20px; top: 31px;}


#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble_1{ top: -33px; right: 127px; animation: intro_move 1800ms ease-in-out infinite; animation-direction: alternate;}
#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble_2{ top: 120px; right: 50px; animation: intro_move_top 1900ms ease-in-out infinite; animation-direction: alternate;}

#about.section_02 .width_con .yellow_con ul.v_con.two_con li.cells .bubble img{ position: absolute; width: 33px; left: 50%; top: 50%; transform: translate(-50%, -50%);}


@keyframes intro_move {
	0% {transform: translateY(0%);}
	50% {transform: translateY(4%);}	
	100% {transform: translateY(0%);}
}

@keyframes intro_move_top {
	0% {transform: translateY(0%);}
	50% {transform: translateY(-5%);}	
	100% {transform: translateY(0%);}
}

#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .title_con{ margin: 20px;}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .title_con h3{}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .title_con h2{}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .title_con h4{}
#about.section_02 .width_con .yellow_con .v_con.two_con li.cells .title_con h5{}




/*-----character-----*/
#character.section_03{ background: #f5f5f7;}
#character.section_03 .width_con{}
#character.section_03 .width_con .title_con{}
#character.section_03 .width_con .v_con.three_con{ pointer-events: none;}
#character.section_03 .width_con .v_con.three_con li{}
#character.section_03 .width_con .v_con.three_con li.cells{ background: rgba(251,240,148, .2); backdrop-filter: blur(10px); overflow: hidden; border-radius: 30px; height: 240px; opacity: 1; transition: all 700ms ease-in-out;}
#character.section_03.wait_scroll .width_con .v_con.three_con li.cells{ opacity: 0;}
#character.section_03 .width_con .v_con.three_con li.cells:nth-child(1){ transition-delay: 900ms;}
#character.section_03 .width_con .v_con.three_con li.cells:nth-child(2){ transition-delay: 1050ms;}
#character.section_03 .width_con .v_con.three_con li.cells:nth-child(3){ transition-delay: 1200ms;}

#character.section_03 .width_con .v_con.three_con li.cells img{ position: absolute; margin: 30px calc(50% - 75px) 0; width: 150px;}
#character.section_03 .width_con .v_con.three_con li.cells:after{ position: absolute; top: 0%; left: 0%; content: '';  width: calc(100% - 14px); height: calc(100% - 14px); margin: 5px; border-radius: 30px; border: 2px solid #fff; opacity: .5; transition: all 300ms ease-out;}
#character.section_03 .width_con .v_con.three_con li.cells .text_box{ padding: 126px 56px 0;}
#character.section_03 .width_con .v_con.three_con li.cells .text_box h4{}
#character.section_03 .width_con .v_con.three_con li.cells .text_box h5{}

/*-----skills-----*/
#skills.section_04{ background: #fff;}
#skills.section_04 .width_con{}
#skills.section_04 .width_con .title_con{}
#skills.section_04 .width_con .title_con h3{}
#skills.section_04 .width_con .title_con h2{}
#skills.section_04 .width_con .title_con h4{}
#skills.section_04 .width_con .title_con h5{}
#skills.section_04 .width_con .v_con.three_con{}
#skills.section_04 .width_con .v_con.three_con li.cells{}
#skills.section_04 .width_con .v_con.three_con li.cells .skill_title{}
#skills.section_04 .width_con .v_con.three_con li.cells .skill_title h3{ color: #fdbf43; font-weight: 500;}
#skills.section_04 .width_con .v_con.three_con li.cells .skill_title h3:before { content: ''; position: absolute; top: 36px; left: 0; width: 376px; border-top: 1px solid #efefef; border-bottom: 1px solid #fff; margin-top: 10px;}

#skills.section_04.wait_scroll .width_con ul.v_con li .sub li span,
#skills.section_04.wait_scroll .width_con .title_con h2,
#skills.section_04.wait_scroll .width_con .title_con h4,
#skills.section_04.wait_scroll .width_con ul li .skill_title { opacity: 0;}
#skills.section_04.wait_scroll .width_con ul.v_con li .sub li span { transform: translateY(10px);}

#skills.section_04 .width_con .title_con h2,
#skills.section_04 .width_con .title_con h4,
#skills.section_04 .width_con ul li .skill_title,
#skills.section_04 .width_con ul.v_con li .sub li span { opacity: 1; transition: all 1500ms ease-in-out;}

#skills.section_04 .width_con .v_con.three_con li.cells .v_con.two_con.sub{ margin-top: 36px;}
#skills.section_04 .width_con .v_con.three_con li.cells .v_con.two_con.sub li.cells{ width: calc(50% - 36px);}
#skills.section_04 .width_con .v_con.three_con li.cells .v_con.two_con.sub li.cells span{ display: block; margin-bottom: 18px; font-size: 16px; transform: translateY(0px);}
#skills.section_04 .width_con .v_con.three_con li.cells .v_con.two_con.sub li.cells img{ position: absolute; top:-400px; left: 500px;}


/*-----portfolio-----*/
#portfolio.section_05{ background: #f5f5f7;}
#portfolio.section_05 .width_con{}
#portfolio.section_05 .width_con .title_con{}
#portfolio.section_05 .width_con .title_con h3{}
#portfolio.section_05 .width_con .title_con h2{}
#portfolio.section_05 .width_con .title_con h4{}
#portfolio.section_05 .width_con .title_con h5{}

#portfolio.section_05 .width_con .v_con.three_con{ margin-top: var(--mrgn-x4);}
#portfolio.section_05 .width_con .v_con.three_con li.cells{ border-radius: 30px; overflow: hidden; transition: all 250ms ease-in-out;}
#portfolio.section_05 .width_con .v_con.three_con li.cells a{}


#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con { position: absolute; top: 0; left: 0; padding: 20px; color: #fff; opacity: 0;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con h4 { color: #fff; margin-bottom: 10px; font-size: 12px; font-weight: 400;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con h3 { color: #fff; margin-bottom: 10px; font-size: 14px; font-weight: 600;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con table {}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con table tr { height: 20px; font-size: 13px;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con table tr:nth-child(3) { height: 40px;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con table tr th { width: 110px; font-weight: 500;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .portfolio_con table tr td { line-height: 1.25em;}

/*웹사이트 어두워지는 배경*/
#portfolio.section_05 .width_con .v_con.three_con li.cells:hover:before{ position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.3); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); border-radius: 25px; overflow: hidden;}

/*웹사이트 테두리*/
#portfolio.section_05 .width_con .v_con.three_con li.cells:hover:after { position: absolute; top: 0%; left: 0%; content: ''; width: calc(100% - 15px); height: calc(100% - 15px); margin: 5px; border-radius: 25px; border: 2px solid #fff; opacity: .5;} 
 

/*btn*/
#portfolio.section_05 .width_con .v_con.three_con li.cells .btn_con { position: absolute; bottom: 20px; left: 20px; opacity: 0; transition: all 250ms ease-in-out;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .btn { position: relative; z-index: 1; text-decoration: none; border-radius: 9px; font-size: 14px; font-weight: 500; text-align: center; width: 146px; height: 26px; line-height: 26px; display: inline-block; transition: all 100ms linear;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .btn:active { transform: scale(.975);}
#portfolio.section_05 .width_con .v_con.three_con li.cells .btn.btn_a { border: 2px solid rgba(253,191,67,1); background: #fdbf43; color: #fff; margin-right: 10px;}
#portfolio.section_05 .width_con .v_con.three_con li.cells .btn.btn_a:hover { border: 2px solid rgba(255,255,255,1); background: #fff; color: #222;}
#portfolio.section_05 .width_con ul.v_con.three_con li.cells .btn.btn_b { border: 2px solid rgba(255,255,255,1);color: #fff; background: none;}
#portfolio.section_05 .width_con ul.v_con.three_con li.cells .btn.btn_b:hover { border: 2px solid rgba(255,255,255,1); background: #fff; color: #222;}

#portfolio.section_05 .width_con .v_con li.cells:hover:before, #portfolio.section_05 .width_con ul.v_con li.cells:hover:after, #portfolio.section_05_2 .width_con ul.v_con.four_con li.cells:hover .portfolio_con, #portfolio.section_05 .width_con .v_con.three_con li.cells:hover .portfolio_con, #portfolio.section_05 .width_con ul.v_con.three_con li.cells:hover .btn_con {opacity: 1;}
#portfolio.section_05_2.wait_scroll .width_con ul.v_con.four_con li.cells, #portfolio.section_05.wait_scroll .width_con ul.v_con.three_con li.cells { opacity: 0; transform: translateY(20px);}


#portfolio.section_05 .width_con ul.v_con.three_con li.cells:nth-child(1) {transition-delay: 700ms;}
#portfolio.section_05 .width_con ul.v_con.three_con li.cells:nth-child(2) {transition-delay: 850ms;}
#portfolio.section_05 .width_con ul.v_con.three_con li.cells:nth-child(3) {transition-delay: 1000ms;}
#portfolio_gallary.section_05_2 .width_con ul.v_con.four_con li.cells:nth-child(1) {transition-delay: 1150ms;}
#portfolio_gallary.section_05_2 .width_con ul.v_con.four_con li.cells:nth-child(2) {transition-delay: 1300ms;}
#portfolio_gallary.section_05_2 .width_con ul.v_con.four_con li.cells:nth-child(3) {transition-delay: 1450ms;}
#portfolio_gallary.section_05_2 .width_con ul.v_con.four_con li.cells:nth-child(4) {transition-delay: 1600ms;}

#portfolio_gallary.section_05_2 .width_con{ margin-top: calc(var(--mrgn) * -10);}
#portfolio_gallary.section_05_2 .width_con .v_con.four_con{}
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells{ border-radius: 30px; overflow: hidden; transition: all 250ms ease-in-out;}

#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells .portfolio_con { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; opacity: 0; transition: all 250ms ease-in-out;}
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells .portfolio_con h4{ margin: 5px 0 0 0;}

#portfolio_gallary.section_05_2 .width_con .v_con.four_con li{ position: relative; height: 100%; background: rgba(255,255,255,.7); border-radius: 30px; cursor: pointer; overflow: hidden; display: inline-block;}
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0 , 0, 0); border-radius: 36px; transition: all 500ms ease-out;}
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells:hover .portfolio_con{ opacity: 1;}

/*갤러리 어두워지는 배경*/
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells:hover:before{ position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.3); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); border-radius: 25px; overflow: hidden;}

/*갤러리 테두리*/
#portfolio_gallary.section_05_2 .width_con .v_con.four_con li.cells:hover:after { position: absolute; top: 0%; left: 0%; content: ''; width: calc(100% - 14px); height: calc(100% - 14px); margin: 5px; border-radius: 25px; border: 2px solid #fff; opacity: .5; transition: all 300ms ease-out;} 


body.lock_scroll{ overflow: hidden;}
.gallary_popup{ position: fixed; top: 0; left: 0; width: 100vw; height: 0; background: rgba(0, 0, 0, .65); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; transition: all 250ms linear, height 0ms 250ms; overflow: hidden; z-index: 9999;}
.gallary_popup.on{height: 100vh; opacity: 1; transition: all 250ms linear, height 0ms;}
.gallary_popup .gallary_popup_bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.gallary_popup .popup_viewer{ position: absolute; top: 0; left: 50%; width: 1200px; height: calc(100vh - 0px); transform: translate(-50%, 0); overflow: auto;}
.gallary_popup .popup_viewer img.origin_img{ width: 100%; max-width: 1200px; display: block; margin: 0 auto 36px;}
.gallary_popup .btn_close { position: absolute; width: 36px; height: 36px; bottom: 36px; margin-left: -18px; background: none; display: inline-block; color: #fdbf43; font-size: 40px; cursor: pointer; top: 100px; right: 15%;}



/*-----contact-----*/
#contact.section_06{ background: #fff;}
#contact.section_06 .width_con{}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con{}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con h3{ font-size: 24px;}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con h2{ font-size: 48px;}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con h4{}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con.add.center i {color: #fdbf43; font-size: 36px; margin-bottom: 10px;}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con.add.center h5 {}
#contact.section_06 .width_con .v_con.four_con li.cells .title_con.add.center h4 {}

#contact.section_06 .width_con .bottom_con { text-align: center; margin-top: 20px;}
#contact.section_06 .width_con .bottom_con img {}
#contact.section_06 .width_con .bottom_con h5 { margin-top: 20px; opacity: .7;}
#contact.section_06 .width_con .bottom_con img { transition: all 1000ms ease-out 1800ms;}
#contact.section_06 .width_con .bottom_con h5 { transition: all 1000ms ease-out 1900ms;}
#contact.section_06 .width_con .bottom_con b{ font-weight: 800;}




            