/* 공통 css */
*{margin: 0; padding: 0; box-sizing: border-box;}
body {font-family: "NotoSansKR", "나눔고딕", "돋움", Dotum, sans-serif; /*font-family: "Nanum Myeongjo", serif;*/}
ul,ol,li {list-style: none;}
a {text-decoration: none; color: #333; display: inline-block;}
img {display: inline-block;}
.blind {position: absolute; left: -9999px; font-size: 0;}
.center {max-width: 1920px; position: relative; margin: 0 auto;}

.fix_flexcen {display: flex; justify-content: center;}
.fix_flexcena {display: flex; align-items: center;}
.fix_flexbet {display: flex; justify-content: space-between;}
.fix_flexaro {display: flex; justify-content: space-around;}
.fix_flexend {display: flex; justify-content: flex-end;}

.flex_align {display: flex; justify-content: center; align-items: center;}


/* 폰트설정 _상대경로 */
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');*/
@font-face {
    font-family: 'NotoSansKR';
    font-weight: 300;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-Light.ttf") format('ttf');
}

@font-face {
    font-family: 'NotoSansKR';
    font-weight: 400;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-Regular.ttf") format('ttf');

}

@font-face {
    font-family: 'NotoSansKR';
    font-weight: 500;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-Medium.ttf") format('ttf');

}

@font-face {
    font-family: 'NotoSansKR';
    font-weight: 600;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-SemiBold.ttf") format('ttf');

}

@font-face {
    font-family: 'NotoSansKR';
    font-weight: 700;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-Bold.ttf") format('ttf');

}

@font-face {
    font-family: 'NotoSansKR';
    font-weight: 800;
    font-style: normal;
    src: url("font/Noto_Sans_KR/static/NotoSansKR-ExtraBold.ttf") format('ttf');

}


/* 메인 영역 */
#main {display: flex; color: #332d22; text-align: center; flex-wrap: wrap;
/*height: 100vh; 보이는 영역만큼만 높이 잡음*/}
.big_box {}
.img_box {width: 40%; /*border: 1px solid #332d22;*/ border-right: 0;}
.main_img {background: url(img/pfp01.jpg) no-repeat center; height: 100%;}

.contents_box {width: 60%;}
.contents_box .main_box {/*border: 1px solid #332d22; padding-top: 180px;*/ height: 100%; padding: 50px;}
.contents_box .main_box span {font-size: 52px; font-weight: 400; font-family: 'NotoSansKR';}
.contents_box .main_box .tit_h1 {font-size: 122px; font-weight: 700; position: relative; /*padding: 60px 0;*/ font-family: 'NotoSansKR';}
.contents_box .main_box .tit_h1::before {content: " "; display: inline-block; width: 766px; height: 72px; background: #7e0706; opacity: .3;
position: relative; top: 155px; left: 0; z-index: -1;}
.contents_box .main_box p {font-size: 32px; font-weight: 700; padding: 60px 0 150px 0; font-family: 'NotoSansKR'; line-height: 50px;}

.contents_box .main_box .keywords {padding-bottom: 104px;}
.contents_box .main_box .keywords span {font-size: 34px; font-weight: 600; font-family: 'NotoSansKR'; padding-right: 30px;}

.small_box {width: 100%;}
.small_box p {font-weight: 400; font-size: 32px; padding: 40px 10px; font-family: 'NotoSansKR';}
.small_box ul {display: flex; justify-content: center;}

.small_box .box01 { cursor: pointer; transition: .3s;
    /*border-left: 1px solid #332d22; border-right: 1px solid #332d22;*/}
.small_box .box01:hover {background: #445748; color: #fff;}
.small_box .box01 p {font-size: 36px;}

.small_box .box02 {display: flex; }
.small_box .box02 ul {width: 50%; /*border: 1px solid #332d22;*/ cursor: pointer; transition: .3s;}
.small_box .a1 {background: #d6dbdc; /*border-right: 0 !important;*/}
.small_box .a1 li {position: relative;}
.small_box .box02 .a1:hover {background: #c0c6c7;}
.small_box .a2 {background: #d2e1f3;}
.small_box .box02 .a2:hover {background: #b9c6d7;}
.small_box .box02 .a1 p::after {width: 6px; height: 6px; content: " "; display: inline-block; border-radius: 50%; background: #332d22;
position: relative; bottom: 8px; left: 11px;}
.small_box .box02 .a2 p::after {width: 6px; height: 6px; content: " "; display: inline-block; border-radius: 50%; background: #332d22;
position: relative; bottom: 8px; left: 11px;}
.small_box .box02 .p1::after {display: none !important;}

.small_box .box03 {display: flex; /*border-bottom: 1px solid #332d22;*/}
.small_box .box03 ul {width: 50%;}
.small_box .box03 div {width: 25%; /*border-left: 1px solid #332d22;*/ cursor: pointer;  transition: .3s;}
.small_box .box03 div:hover {background: #f4f1ec;}
.small_box .a3 {background: #c8b5b8; /*border-left: 1px solid #332d22; border-right: 1px solid #332d22;*/ cursor: pointer; transition: .3s;}
.small_box .a3:hover {background: #b6a4a7;}
.uni {/*border-left: none !important; border-right: 1px solid #332d22;*/}


/* 프로필 영역 */
#profile {display: flex; flex-wrap: wrap; justify-content: space-between;}
.left_box {max-width: 1270px; width: 60%; text-align: center;}
.tit {color: #332d22; text-align: center; padding-top: 124px;}
.tit::before {content: " "; display: inline-block; background: url(img/deco02.png) no-repeat; width: 32px; height: 35px;
position: relative; top: 190px; right: 310px;}
.tit::after {content: " "; display: inline-block; background: url(img/deco01.png) no-repeat; width: 38px; height: 43px;
position: relative; bottom: 230px; left: 330px;}
.tit h2 {font-size: 54px; font-weight: 300; font-family: 'NotoSansKR';}
.tit h1 {font-size: 120px; font-weight: 700; font-family: 'NotoSansKR';}

.contents {text-align: left; padding-left: 130px;}
.contents div {padding-bottom: 80px;}
.contents h3 {color: #7e0706; font-size: 42px; font-weight: 700; font-family: 'NotoSansKR'; padding-bottom: 40px;}
.contents span {color: #332d22; font-size: 28px; font-weight: 400; display: block; font-family: 'NotoSansKR';}
.career span {display: inline; padding-right: 20px;}
.special_act span {display: inline;}
.special_act div {padding-bottom: 40px;}
.contents p {color: #332d22; font-size: 26px; font-weight: 600; font-family: 'NotoSansKR';}
.career p {display: inline;}
.education p {padding-top: 23px;}
.education .p1 {padding-bottom: 43px;}

.special_act p {display: inline;}
.special_act .p1 {display: inline-block;}
.special_act span {padding-right: 20px;}


.right_box {width: 40%; position: relative; z-index: -1;}
.pfp_02 {background: url(img/pfp02.jpg) no-repeat; height: 768px; width: 530px; position: absolute; right: 0; /*border: 1px solid #666666;*/
z-index: 1;}
.tulips {background: url(img/tulips.jfif) no-repeat; width: 474px; height: 384px; position: absolute; right: 0; bottom: 280px;
background-position: right; /*border: 1px solid #666666; z-index: -1;*/}
.tulips::before {content: " "; display: inline-block; background: url(img/introduce.png) no-repeat; width: 473px; height: 465px;
position: relative; bottom: 330px; right: 260px; animation: rotate 70s normal infinite linear;}

@keyframes rotate {
    0% {transform: rotate(0);}
    100% {transform: rotate(360deg);}
}


/* 포트폴리오 영역 */
.tit_box {background: #fffdf9; border: 1px solid rgba(152,129,128,.5); height: 137px;}
.tit_box h1 {color: #332d22; font-size: 64px; font-weight: 700; font-family: 'NotoSansKR';}

.section {height: 100%; padding-top: 335px; position: relative;}
.section .deco {background: url(img/deco.png) no-repeat; width: 163px; height: 164px; display: inline-block; position: absolute;
top: 130px; left: 50%; transform: translate(-50%);}

.section ul {display: flex; padding-bottom: 130px;}
.section ul.portfolio_05 {padding-bottom: 160px;}

.portfolio_01 .img_box div {background: url(img/portfolio1.png) no-repeat; width: 410px; height: 760px;}
.portfolio_02 .img_box div {background: url(img/portfolio2.png) no-repeat; width: 410px; height: 760px;}
.portfolio_03 .img_box div {background: url(img/portfolio3.png) no-repeat; width: 410px; height: 760px;}
.portfolio_04 .img_box div {background: url(img/portfolio4.png) no-repeat; width: 410px; height: 760px;}
.portfolio_05 .img_box div {background: url(img/portfolio5.png) no-repeat; width: 410px; height: 760px;}

.section .text_box {width: 70%; padding-top: 106px;}
.align {text-align: end;}

.section .text_box h2 {font-size: 46px; color: #7e0706; font-weight: 700; font-family: 'NotoSansKR';}
.section .text_box h3 {font-size: 34px; color: #7e0706; font-weight: 600; font-family: 'NotoSansKR'; padding: 150px 0 65px 0;}
.section .text_box p {font-size: 24px; color: #332d22; font-weight: 400; font-family: 'NotoSansKR'; line-height: 50px;}
.section .text_box .p1 {padding: 30px 0 10px 0; font-size: 20px;}
.section .text_box a {display: block; }
.section .text_box a:hover span {text-decoration: underline 1px solid #7e0706; text-underline-position: under;}
.section .text_box a span {font-size: 20px; color: #7e0706; font-weight: 400; font-family: 'NotoSansKR'; line-height: 40px;}
/*.section .text_box a span::before {content: " "; display: inline-block; background: url(img/bullet.png) no-repeat; width: 19px; height: 19px;}*/

.h2_wrap {display: flex; justify-content: space-between;}
.h2_wrap .h2_1 {padding-left: 30px;}
.h2_wrap .h2_2 {padding-right: 30px;}
.line {height: 4px; background: #4e000a; opacity: .5; position: relative; width: 57%; left: 0; top: 34px;}
.line_2 {width: 70%;}
/*
.line1 {width: 61%;}
.line2 {width: 66%;}
.line3 {width: 76%;}*/

.padding_left {padding-left: 50px;}
.padding_right {padding-right: 50px;}

.section .text_box a::before {content: " "; display: inline-block; background: #7e0706; width: 6px; height: 6px; position: relative; bottom: 5px; right: 5px;}
.two a {padding-left: 10px;}


/* 하단영역 */
footer {background: #fffdf9; padding: 50px 0 40px 0; height: 100%; color: #332d22;}
.footer_inner {border: 1px solid rgba(51,45,34,.5); background: #fffdf9;}
.footer_inner ul {z-index: 1; height: 455px; flex-wrap: wrap;}


.copyright {text-align: end; padding-right: 12%;}

.copyright span {font-size: 72px; color: #332d22; font-weight: 700; font-family: 'NotoSansKR'; padding-right: 9px;}

.copyright span em::before {content: " "; display: inline-block; background: #d8b3b0; height: 37px; width: 100%; z-index: -1; position: relative; bottom: 100px;}
/*.copyright .span2 em::before {content: " "; display: inline-block; background: #d8b3b0; height: 37px; width: 80%; z-index: -1; position: relative; bottom: 100px;}*/
.copyright p {font-size: 18px; font-weight: 600; font-family: 'NotoSansKR'; line-height: 40px;}


.contact h4 {font-size: 44px;  font-weight: 800; font-family: 'NotoSansKR'; padding-bottom: 40px;}
.contact p {font-size: 26px; font-weight: 500; font-family: 'NotoSansKR'; line-height: 46px;}
.contact p span {font-weight: 800; font-family: 'NotoSansKR';}



/* 미디어쿼리 영역 */
@media screen and (max-width:1800px) {
    /* 메인영역 */ 
    .main_img {background-position: bottom;}
    .contents_box .main_box .tit_h1 {font-size: 100px;}
    .contents_box .main_box .tit_h1::before {width: 660px; height: 60px; top: 128px;}
    .contents_box .main_box span {font-size: 40px;}

    .contents_box .main_box p {font-size: 26px;}
    .contents_box .main_box .keywords span {font-size: 28px;}


    /* 프로필영역 */
    .tit h1 {font-size: 100px;}
    .tit h2 {font-size: 46px;}
    .contents h3 {font-size: 38px;}
    .contents span {font-size: 26px;}
    .contents p {font-size: 24px;}

    /* 하단영역 */
    .copyright span {font-size: 58px;}
    .copyright span em::before {height: 32px; bottom: 80px;}
    .contact h4 {font-size: 38px; padding-bottom: 24px;}
    .contact p {font-size: 24px;}
}

@media screen and (max-width:1460px) {
    /* 메인영역 */ 
    .contents_box .main_box p {font-size: 24px;}
    .contents_box .main_box .keywords span {font-size: 26px;}

    .small_box .box01 p {font-size: 32px;}
    .small_box p {font-size: 28px;}

    /* 프로필영역 */
    .left_box {width: 100%;}
    .right_box {width: 100%;}
    .pfp_02 {display: none;}
}

/*
@media screen and (max-width:1340px) {
    .contents_box .main_box span {font-size: 32px;}
    .contents_box .main_box .tit_h1 {font-size: 88px;}
    .contents_box .main_box .tit_h1::before {width: 550px; height: 50px; top: 110px;}
    .contents_box .main_box p {font-size: 22px;}
    .contents_box .main_box .keywords span {font-size: 24px;}

    .contents_box .main_box {padding: 60px;}
    .contents_box .main_box .keywords {padding-bottom: 101px;}
    
}*/

@media screen and (max-width:1340px) {/*1150*/
    /* 메인영역 */ 
    .img_box {display: none;}
    .contents_box {width: 100%;}
    .small_box .box01 {background: #445748; color: #fff;}
    .contents_box .main_box .keywords {padding-bottom: 76px;}

    .small_box .box01 p {font-size: 28px;}
    .small_box p {font-size: 24px;}
    .small_box .box02 .a1 p::after {width: 4px; height: 4px; bottom: 5px;}
    .small_box .box02 .a2 p::after {width: 4px; height: 4px; bottom: 5px;}

    /* 프로필영역 */
    .tit h1 {font-size: 82px;}
    .tit h2 {font-size: 34px;}

    .contents h3 {font-size: 34px;}
    .contents span {font-size: 22px;}
    .contents p {font-size: 20px;}

    .contents {padding-left: 60px;}
    
    /* 포트폴리오영역 */
    .tit_box h1 {font-size: 50px;}
    .section .text_box {width: 100%; padding: 0 50px;}
    .section .text_box h2 {font-size: 40px;}
    
    .section .text_box h3 {font-size: 30px;}
    .section .text_box p {font-size: 18px; font-weight: 600;}
    .section .text_box .p1 {font-size: 18px;}

    /* 하단영역 */
    .copyright span {font-size: 46px;}
    .copyright span em::before {height: 24px; bottom: 65px;}
    .copyright p {font-size: 15px;}
    .contact h4 {font-size: 30px; padding-bottom: 10px;}
    .contact p {font-size: 18px;}
    
    .footer_inner ul {justify-content: flex-start; padding: 25px;}
    
}

@media screen and (max-width:870px) {
    /* 메인영역 */ 
    .contents_box .main_box .tit_h1 {font-size: 72px;}
    .contents_box .main_box .tit_h1::before {width: 400px; height: 40px; top: 90px;}
    
    .contents_box .main_box {padding: 30px;}
    .contents_box .main_box span {font-size: 26px;}
    .contents_box .main_box p {font-size: 17px; padding: 60px 0 150px 0;}
    .contents_box .main_box .keywords span {font-size: 18px;}
    .small_box .box01 p {font-size: 18px;}
    .small_box p {padding: 26px 8px; font-size: 12px;}


    /* 프로필영역 */
    .tit h1 {font-size: 58px;}
    .tit h2 {font-size: 22px;}
    .tit::before {top: 120px; right: 160px;}
    .tit::after {bottom: 155px; left: 142px;}

    .contents {padding-left: 24px;}
    .contents h3 {font-size: 24px;}
    .contents span {font-size: 16px;}
    .contents p {font-size: 13px;}

    .small_box .box02 .a1 p::after {width: 3px; height: 3px; bottom: 3px; left: 8px;}
    .small_box .box02 .a2 p::after {width: 3px; height: 3px; bottom: 3px; left: 8px;}
    
    /* 포트폴리오영역 */
    .tit_box h1 {font-size: 38px;}
    .section {padding-top: 310px;}
    .section .deco {top: 50px;}
    .section .text_box h2 {font-size: 30px;}
    .line {top: 20px;}
    .section .text_box h3 {font-size: 24px;  padding: 40px 0;}
    .section .text_box p {display: none;}
    .section .text_box .p1 {display: block; font-size: 18px; padding: 10px 0;}
    .section .text_box a span {font-size: 15px;}

    /* 하단영역 */
    .copyright span {font-size: 32px;}
    .copyright span em::before {height: 20px; bottom: 44px;}
    .copyright {padding-right: 8%;}
    .copyright p {font-size: 12px;}
    .contact h4 {font-size: 24px;}
}