/* main common */
main{width:100%; padding-top:10.2rem;}
main article{padding-top:30rem;}
main article .inr{margin:auto; width:84%;}
main h2.main_tit{font-weight:800; font-family:'Montserrat', sans-serif; color:var(--c_000);}
main h2.main_tit.little{margin:0 0 4.5rem; font-size:2.6041vw;}
main h2.main_tit.big{font-size:4.16vw;}
@media(max-width:1680px){
    main{padding-top:9.2rem;}
    main article .inr{width:92%;}
    main h2.main_tit.little{font-size:3.3vw;}
    main h2.main_tit.big{font-size:5.5vw;}
}
@media(max-width:1280px){
    main{padding-top:7.2rem;}
    main article{padding-top:20rem;}
    main article .inr{width:96%;}
    main h2.main_tit.little{margin-bottom:4rem; font-size:3.8vw;}
}
@media(max-width:767px){
    main{padding-top:8rem;}
    main article{padding-top:12rem;}
    main h2.main_tit.little{margin-bottom:3.5rem; font-size:7vw;}
    main h2.main_tit.big{font-size:9vw;}
}


/* sec_main (intro) */
#main{position:relative; height:calc(100vh - 10.2rem); padding-top:0 !important;}
#main .tit{position:absolute; margin-top:-4rem; left:50%; top:50%; transform:translate(-50%,-50%); text-align:center; font-size:0;}
#main h1{display:inline-block; color:var(--c_000); font-size:7.8125vw; font-weight:800;}
#main h1.img{margin-top:2.5vw; width:60vw; animation:tit_up 0.8s ease both;}
#main h1.img img{width:100%;}
#main h1.img img.img_dark{display:none;}
#main .obj{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:37vw; text-align:center;}
#main .obj img{height:100%; object-fit:contain;}
#main .obj img.obj01{margin-top:8rem; animation:main_load 2s 0.5s ease both;}
#main .obj img.obj02{margin-top:-8rem; animation:opacity 2s 0.5s ease both;}
#main .hash_wrap{display:flex; position:absolute; flex-direction:column; justify-content:center; top:0; left:0; width:100%; height:100%; overflow:hidden;}
#main .hash_wrap > div{display:flex; position:relative; padding:1vw 0; flex-wrap:nowrap; white-space:nowrap; pointer-events:none;}
#main .hash_wrap > div > .box{font-size:11.5vh; font-weight:900; color:var(--c_000);}
#main .hash_wrap .rolling_left{justify-content:flex-start;}
#main .hash_wrap .rolling_left .box{opacity:0.045;}
#main .hash_wrap .rolling_right{justify-content:flex-end;}
#main .hash_wrap .rolling_right .box{opacity:0.025;}
#main .scroll_down{position:absolute; left:50%; bottom:4rem; transform:translateX(-50%); z-index:2;}
#main .scroll_down span{display:block; position:relative; width:3rem; height:5rem; border:2px solid var(--c_000); border-radius:5rem; box-sizing:border-box;}
#main .scroll_down span:before{content:''; display:block; position:absolute; top:1rem; left:50%; width:0.6rem; height:0.6rem; border-radius:50%; background:var(--c_000); transform:translateX(-50%); box-sizing:border-box; animation:scroll 2s infinite;}
@keyframes scroll{
  0%{transform:translate(-50%, 0); opacity:0;}
  40%{opacity:1;}
  80%{transform:translate(-50%, 2rem); opacity:0;}
  100%{opacity:0;}
}
@keyframes main_load{
    0%{margin-right:-100rem; opacity:0;}
    100%{margin-right:-40rem; opacity:1;}
}
@keyframes opacity{
    0%{opacity:0;}
    100%{opacity:1;}
}
@keyframes tit_up{
    0%{transform:translateY(10rem); opacity:0;}
    100%{transform:translateY(0); opacity:1;}
}
@media(max-width:1680px){
    #main{height:calc(100vh - 9.2rem);}
    #main h1{font-size:10.5vw;}
    #main h1.img{width:80vw;}
    #main .hash_wrap > div > .box{6vw;}
    #main .obj{height:70vh;}
}
@media(max-width:1280px){
    #main{height:calc(100vh - 7.2rem);}
    #main .obj{height:auto;}
    #main .obj img{width:45vw;}
    @keyframes main_load{
        0%{margin-right:-70rem; opacity:0;}
        100%{margin-right:-30rem; opacity:1;}
    }
}
@media(max-width:767px){
    #main{height:calc(100vh - 8rem);}
    #main h1{font-size:13vw;}
    #main h1.img{width:94vw;}
    #main .hash_wrap > div > .box{font-size:13.5vh;}
    #main .obj{height:100%;}
    #main .obj img{position:absolute; width:75%; height:auto; left:50%;}
    #main .obj img.obj01{bottom:20%; margin-top:0;}
    #main .obj img.obj02{top:20%; margin-top:0; animation:main_load2 2s 0.5s ease both;}
    @keyframes main_load{
        0%{margin-right:0; opacity:0; transform:translateX(-80%)}
        100%{margin-right:0; opacity:1; transform:translateX(-50%)}
    }
    @keyframes main_load2{
        0%{margin-left:0; opacity:0; transform:translateX(-20%)}
        100%{margin-left:0; opacity:1; transform:translateX(-50%)}
    }
}



/* profile */
#profile{position:relative; padding-top:20rem;}
#profile .profile_wrap{display:flex; padding:4.16vw 5.2083vw; border-radius:3rem; box-shadow:0 0 6rem rgba(0,0,0,0.1); background:rgba(255,255,255,0.9);}
@supports (background:rgba(255,255,255,0.9)){ 
    #profile .profile_wrap{background:rgba(255,255,255,0.5); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);}
}
#profile .cont01{padding-right:5.2083vw; width:20.83vw; text-align:center;}
#profile .cont01 .pf_img{display:block; margin-bottom:3.5rem; width:100%;}
#profile .cont01 .pf_img img{width:100%;}
#profile .cont01 .en_name{display:block; font-size:2rem; font-weight:bold; color:var(--c_111);}
#profile .cont01 .ko_name{display:block; margin:1rem auto 3.5rem; font-size:2rem;}
#profile .cont01 .contact li{font-size:1.8rem; margin-bottom:0.5rem;}
#profile .cont01 .contact li a{color:var(--c_454545);}
#profile .cont02{width:calc(100% - 20.83vw); border-top:2px solid var(--c_000);}
#profile .cont02 .box01 h2{padding:2.5rem 0; font-size:3rem; font-weight:600; color:var(--c_111);}
#profile .cont02 .box01 p{font-size:1.8rem;}
#profile .cont02 .list{display:flex; flex-wrap:wrap; justify-content:space-between;}
#profile .cont02 .list > li{ margin-top:5rem; width:calc(100% / 2 - 2rem); border-top:1px solid var(--c_454545);}
#profile .cont02 .list > li > h3{position:relative; padding:1.5rem 0 2rem; font-size:2rem; font-weight:bold; color:var(--c_111); pointer-events:none;}
#profile .cont02 .list > li > h3 i{display:none; position:absolute; top:50%; right:0; transform:translateY(-50%); width:1.8rem; height:1.8rem; transition:0.5s;}
#profile .cont02 .list > li > h3 i:before,
#profile .cont02 .list > li > h3 i:after{content:''; display:block; position:absolute; background:var(--c_111);}
#profile .cont02 .list > li > h3 i:before{top:50%; transform:translateY(-50%); width:100%; height:2px; transition:0.5s;}
#profile .cont02 .list > li > h3 i:after{left:50%; transform:translateX(-50%); width:2px; height:100%;}
#profile .cont02 .list > li > h3.active i{transform:translateY(-50%) rotate(-90deg);}
#profile .cont02 .list > li > h3.active i:before{opacity:0;}
#profile .cont02 .list > li > ul.st01 > li{position:relative; padding-left:1.4rem; font-size:1.8rem;}
#profile .cont02 .list > li > ul.st01 > li:before{content:''; display:block; position:absolute; left:0; top:1.1rem; width:0.6rem; height:0.6rem; background:var(--c_aaa); border-radius:50%;}
#profile .cont02 .list > li > ul.st01 > li+li{margin-top:0.5rem;}
#profile .cont02 .list > li > ul.st02 > div{display:flex; flex-wrap:wrap;} 
#profile .cont02 .list > li > ul.st02 > div > li{margin-right:1.1rem; margin-bottom:1.1rem; width:calc(100% / 7 - 1rem);} 
#profile .cont02 .list > li > ul.st02 > div > li:nth-child(7n){margin-right:0;}
#profile .cont02 .list > li > ul.st02 > div > li img{width:100%;} 
#profile .obj{position:absolute; top:0; left:0; width:100%; height:100%; }
#profile .obj img{display:block; position:absolute;}
#profile .obj .obj01{right:2%; top:5rem; width:63rem;}
#profile .obj .obj02{left:2%; bottom:-20rem; width:86rem;}
@media(max-width:1680px){
    #profile .cont01{width:32%;}
    #profile .cont02{width:calc(100% - 30%);}
    #profile .obj .obj01{width:55rem;}
    #profile .obj .obj02{width:65rem;}
}
@media(max-width:1280px){
    #profile{padding-top:15rem;}
    #profile .cont01{padding-right:8rem; width:34rem;}
    #profile .cont02{width:calc(100% - 34rem);}
    #profile .cont02 .list > li > h3{pointer-events:auto; cursor:pointer;}
    #profile .cont02 .list > li > h3 i{display:block;}
    #profile .cont02 .list > li > ul{display:none;}
    #profile .cont02 .list > li.career > ul{display:block;}
    #profile .obj .obj01{width:45rem;}
    #profile .obj .obj02{width:55rem;}
}
@media(max-width:1024px){
    #profile .profile_wrap{padding:5rem; flex-direction:column; align-items:center;}
    #profile .cont01{padding-right:0; width:25rem;}
    #profile .cont01 .contact li{display:none;}
    #profile .cont02{width:100%;}
}
@media(max-width:767px){
    #profile{padding-top:9rem;}
    #profile .profile_wrap{padding:2.5rem 1.5rem;}
    #profile .cont01{width:100%;}
    #profile .cont01 .pf_img{margin:0 auto 2.5rem; width:25rem;}
    #profile .cont02 .box01 h2{padding:2rem 0; font-size:2rem;}
    #profile .cont02 .box01 p > br{display:none;}
    #profile .cont02 .list{margin-top:2.5rem; flex-direction:column;}
    #profile .cont02 .list > li{margin-top:0; width:100%;}
    #profile .cont02 .list > li > ul{padding-bottom:2.5rem;}
    #profile .cont02 .list > li.skill > ul{padding-bottom:0;}
    #profile .obj .obj01{top:0; width:55%;}
    #profile .obj .obj02{bottom:-12rem; width:58%;}
}


/* 포트폴리오 공통 */
.pf_common{position:relative; z-index:1;}
.pf_common:before{content:''; display:block; position:absolute; top:30rem; width:62.5%; height:2px; background:var(--c_000);}
.pf_common .tit_box{display:flex; align-items:center; padding:3rem 0 6rem;}
.pf_common .btn_more{display:flex; position:relative; align-items:center; background:var(--primary); width:9.5vw; height:3.125vw; border-radius:1.5625vw; transition:0.5s ease; box-shadow:1rem 1rem 3rem rgba(245,98,52,0.3);}
.pf_common .btn_more span{display:block; padding-left:1.099vw; font-size:1.0416vw; color:#fff; font-weight:600; transition:0.5s ease;}
.pf_common .btn_more svg{display:block; position:absolute; top:50%; right:1.099vw; transform:translateY(-50%); width:0.9vw; fill:#fff; transition:0.5s ease;}
.pf_common .btn_more.mo{display:none;}
.pf_common .btn_more.dark{display:none;}
.pf_common .swiper01{padding-bottom:5rem;}
.pf_common .swiper01 .swiper-slide{display:flex;}
.pf_common .swiper01 .txt_box > i{display:block; margin-bottom:1rem; color:var(--primary); font-size:1.6rem; font-weight:bold;}
.pf_common .swiper01 .txt_box > .per_pj{color:#13c0e5;}
.pf_common .swiper01 .txt_box .pj_tit{display:block; margin-bottom:6rem; font-size:1.8229vw; font-weight:bold; color:var(--c_111);}
.pf_common .swiper01 .txt_box .pj_info li{display:flex; font-size:1.8rem; color:var(--c_454545);}
.pf_common .swiper01 .txt_box .pj_info li+li{margin-top:0.7rem;}
.pf_common .swiper01 .txt_box .pj_info li b{display:block; width:10.5rem; color:var(--c_222);}
.pf_common .swiper01 .txt_box .pj_info li p{display:block; width:calc(100% - 10.5rem);}
.pf_common .swiper01 .txt_box .pj_info li i{display:inline-block; margin:0 1rem; color:var(--c_aaa);}
.pf_common .swiper01 .txt_box .pj_hash{margin:3.5rem 0; font-size:0;}
.pf_common .swiper01 .txt_box .pj_hash li{display:inline-block; margin-right:2rem; color:var(--c_aaa); font-size:1.8rem;}
.pf_common .swiper01 .txt_box .btn_wrap{display:flex;}
.pf_common .swiper01 .txt_box .btn_wrap a{display:flex; padding:0 1.099vw; align-items:center; height:2.8vw; border-radius:1.5625vw; font-size:1.0416vw; font-weight:bold; background:var(--c_f5f5f5); transition:0.4s ease;}
.pf_common .swiper01 .txt_box .btn_wrap a+a{margin-left:2rem;}
.pf_common .swiper01 .txt_box .btn_wrap a span{display:block; margin-right:1.0416vw; transition:0.4s ease; color:var(--c_333);}
.pf_common .swiper01 .txt_box .btn_wrap a svg{display:block; width:0.8333vw; fill:var(--c_aaa); transition:0.4s ease;}
.pf_common .swiper01 .txt_box .btn_wrap a.dark{display:none;}
.pf_common .swiper02 .top{display:flex; margin-bottom:2.5rem; justify-content:space-between; align-items:center;}
.pf_common .swiper02 .top i{display:block; color:var(--c_aaa); font-size:1.6rem;}
.pf_common .swiper02 .control{display:flex; justify-content:flex-end;}
.pf_common .swiper02 .control > div{position:relative; margin-left:2rem; left:auto; right:auto; bottom:auto; top:auto; margin-top:0; width:1.9791vw; height:auto;}
.pf_common .swiper02 .control > div:after{display:none;}
.pf_common .swiper02 .control > div svg{display:inline-block; vertical-align:middle; width:100%; fill:var(--c_000);}
.pf_common .swiper-button-next.swiper-button-disabled,
.pf_common .swiper-button-prev.swiper-button-disabled{opacity:0.2;}
.pf_common .swiper02 .swiper-slide{position:relative; cursor:pointer;}
.pf_common .swiper02 .swiper-slide:after{content:''; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; background:rgba(0,0,0,0.03);}
.pf_common .swiper02 .swiper-slide img{display:block; width:100%;}
.pf_common .swiper02 .swiper-slide-thumb-active:after{opacity:0.5; transition:0.3s ease;}
.pf_common .swiper02 .swiper-slide-thumb-active:before{content:''; display:block; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:100%; height:0.5rem; background:var(--primary); z-index:5;}
.pf_common .swiper02 .swiper-slide-thumb-active{transition:0.3s ease;}
.pf_common .swiper02 .swiper-slide-thumb-active img{opacity:0.2; filter:grayscale(100%); transition:0.3s ease;}
@media(hover:hover){
    .pf_common:before{width:65%;}
/*
    .pf_common .btn_more:hover{width:7.3958vw;}
    .pf_common .btn_more:hover span{opacity:1;}
    .pf_common .btn_more:hover svg{transform:translateY(-50%) rotate(180deg); transform-origin:center;}
*/
    .pf_common .swiper .txt_box .btn_wrap a:hover{background:var(--c_fff); box-shadow:1rem 1rem 3rem rgba(245,98,52,0.3);}
    .pf_common .swiper01 .txt_box .btn_wrap a:hover span{color:var(--primary);}
    .pf_common .swiper01 .txt_box .btn_wrap a:hover svg{fill:var(--primary);}
}
@media(max-width:1680px){
    .pf_common .btn_more{width:12.8vw; height:4vw; border-radius:2vw;}
    .pf_common .btn_more span{padding-left:1.32vw; font-size:1.5vw;}
    .pf_common .btn_more svg{right:1.32vw; width:1.3vw;}
    .pf_common .swiper01 .txt_box .pj_tit{font-size:2.5vw;}
    .pf_common .swiper01 .txt_box .btn_wrap a{padding:0 2.3rem; height:5.8rem; font-size:2rem; border-radius:2.9rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a span{margin-right:1.5rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a svg{width:1.5rem;}
    @media(hover:hover){
        /* .pf_common .btn_more:hover{width:9.5vw;} */
    }
}
@media(max-width:1280px){
    .pf_common:before{top:20rem;}
    .pf_common .swiper01 .txt_box .pj_tit{margin-bottom:4rem; font-size:2.8vw;}
    .pf_common .swiper01 .txt_box .pj_hash{margin:2.5rem 0;}
    .pf_common .swiper01 .txt_box .btn_wrap a{background:var(--c_333); font-weight:500; height:5rem; border-radius:2.5rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a span{color:var(--c_fff);}
    .pf_common .swiper02 .control > div{width:4rem;}
}
@media(max-width:1024px){
    .pf_common:before{display:none;}
    .pf_common .inr{text-align:center; border-top:2px solid var(--c_000);}
    .pf_common .tit_box{padding:2.5rem 0 4rem; justify-content:center !important;}
    .pf_common .swiper01{padding-bottom:4rem;}
    .pf_common .swiper01 .txt_box > i{margin-bottom:0.5rem;}
    .pf_common .swiper01 .txt_box .pj_tit{margin-bottom:2.5rem;}
    .pf_common .swiper01 .txt_box .pj_info li{justify-content:center;}
    .pf_common .swiper01 .txt_box .pj_info li+li{margin-top:0.5rem;}
    .pf_common .swiper01 .txt_box .pj_info li b{margin-right:1.5rem; width:auto;}
    .pf_common .swiper01 .txt_box .pj_info li:last-child b{width:8.5rem;}
    .pf_common .swiper01 .txt_box .pj_info li p{width:auto; text-align:left;}
    .pf_common .swiper01 .txt_box .pj_info li:last-child p{max-width:clac(100% - 10rem);}
    .pf_common .swiper01 .txt_box .pj_hash{margin:1.5rem 0 2rem;}
    .pf_common .swiper01 .txt_box .btn_wrap{justify-content:center;}
    .pf_common .swiper02 .top{margin-bottom:1.5rem;}
    .pf_common .swiper02 .control > div{width:3.5rem;}
    .pf_common .btn_more.pc{display:none;}
    .pf_common .btn_more.mo{display:inline-flex; margin-top:3rem; margin-left:0 !important; margin-right:0 !important; padding:2.3rem; width:auto !important; height:5rem; border-radius:2.5rem;}
    .pf_common .btn_more.mo span{opacity:1 !important; margin-right:1.5rem; padding:0; font-size:1.8rem;}
    .pf_common .btn_more.mo svg{position:relative; transform:none !important; right:auto; top:auto; width:1.5rem;}
    .pf_common .btn_more.dark{display:none;}
}
@media(max-width:767px){
    .pf_common .tit_box{padding:2.5rem 0 3.5rem;}
    .pf_common .swiper01 .txt_box .pj_tit{font-size:2.5rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a{padding:0 1.8rem; height:4.6rem; font-size:1.8rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a+a{margin-left:1rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a span{margin-right:1.2rem;}
    .pf_common .swiper01 .txt_box .btn_wrap a svg{width:1.3rem;}
    .pf_common .swiper02 .control > div{width:2.8rem;}
}

/* 웹포폴 */
#web:before{left:0;}
#web .btn_more{margin-left:4.1666vw;}
#web .swiper01 .display{display:block; width:51.5vw;}
#web .swiper01 .display img{width:100%;}
#web .swiper01 .txt_box{padding-left:5rem; width:calc(100% - 51.5vw);}
@media(max-width:1280px){
    #web .swiper01 .display{width:55%;}
    #web .swiper01 .txt_box{width:calc(100% - 55%);}
}
@media(max-width:1024px){
    #web .swiper01 .swiper-slide{flex-direction:column; align-items:center;}
    #web .swiper01 .display{width:80%;}
    #web .swiper01 .txt_box{margin-top:1.5rem; padding-left:0; width:100%; text-align:center;}
}
@media(max-width:767px){
    #web .swiper01 .display{margin-left:2.5%; width:100%;}
}

/* 그래픽포폴 */
#graphic:before{right:0; }
#graphic .tit_box{justify-content:flex-end;}
#graphic .btn_more{margin-right:4.1666vw;}
#graphic .swiper01 .swiper-slide{justify-content:center; flex-direction:row-reverse;}
#graphic .swiper01 .display{width:20.5vw;}
#graphic .swiper01 .display img{width:100%;}
#graphic .swiper01 .txt_box{padding-right:8rem; margin-top:3rem; max-width:90rem; min-width:50rem;}
#graphic .swiper01 .display_wrap{position:relative; padding-top:3rem;}
#graphic .swiper01 .display_wrap:before{content:'* 화면에 마우스를 올리거나 모바일 접속 시 터치해보세요'; display:block; position:absolute; left:0; top:0; font-size:1.6rem; color:var(--c_aaa);}
#graphic .swiper01 .display_wrap .display_img{width:70rem;}
#graphic .swiper01 .display_wrap .work_img{display:block; position:absolute; padding-top:54.6%; top:calc(1.8% + 3rem); left:50%; transform:translateX(-50%); width:97.3%; background-repeat:no-repeat; background-size:100% auto; background-position:0 0; overflow:hidden; cursor:pointer; border-radius:0.3rem; transition:background-position 6s ease;}
#graphic .swiper01 .display_wrap .work_img:hover{background-position:0 100%;}
#graphic .swiper01 .display_wrap .work_img.st01{background-size:cover !important; background-position:center !important;}
#graphic .obj{display:block; position:absolute; top:5rem; left:-8%; z-index:-1;}
@media(max-width:1680px){
    #graphic .obj{width:50rem;}
}
@media(max-width:1280px){
    #graphic .swiper01 .swiper-slide{justify-content:space-between;}
    #graphic .swiper01 .txt_box{min-width:auto; width:50%;}
    #graphic .swiper01 .display_wrap{width:50%;}
    #graphic .swiper01 .display_wrap .display_img{width:100%;}
    #graphic .obj{width:36rem;}
}
@media(max-width:1024px){
    #graphic .swiper01 .swiper-slide{flex-direction:column; align-items:center;}
    #graphic .swiper01 .display_wrap{width:55%;}
    #graphic .swiper01 .display_wrap:before{width:100%; text-align:center;}
    #graphic .swiper01 .txt_box{padding-right:0; width:100%; max-width:100%; text-align:center;}
}
@media(max-width:767px){
    #graphic .swiper01 .display_wrap{width:80%;}
    #graphic .obj{width:36%;}
}



/* contac */
#contact{position:relative;}
#contact .contact_wrap{margin:auto; padding-bottom:10rem; width:94.8%; border-top:2px solid var(--c_000);}
#contact .main_tit.little{margin:3rem auto 6rem; text-align:center;}
#contact ul{display:flex; justify-content:center;}
#contact ul li{text-align:center; font-size:2rem; width:20.5rem;}
#contact ul li+li{margin-left:15%;}
#contact ul li span.icon{display:flex; margin:auto; justify-content:center; align-items:center; width:15rem; height:15rem; border-radius:50%; background:var(--c_f5f5f5);}
#contact ul li span.icon svg{width:auto; height:4.5rem; fill:var(--c_000);}
#contact ul li h3{margin:2rem auto 0.8rem; color:var(--c_222); font-weight:bold;}
#contact ul li a{display:block;}
#contact ul li p{color:var(--c_454545);}
#contact .obj{display:block; position:absolute; top:-10rem; right:-20%; z-index:-1;}
@media(max-width:1680px){
    #contact .obj{right:-18%; width:80rem;}
}
@media(max-width:1280px){
    #contact .main_tit.little{margin:2.5rem auto 5rem;}
}
@media(max-width:767px){
    #contact .main_tit.little{margin:2.5rem auto 3.5rem;}
    #contact ul{flex-direction:column; align-items:center;}
    #contact ul li{display:flex; align-items:center; justify-content:center; width:100%; text-align:left;}
    #contact ul li+li{margin-left:0; margin-top:2.5rem; padding-top:2.5rem; border-top:1px dashed var(--c_ccc);}
    #contact ul li span.icon{margin:0 4rem 0 0; width:12rem; height:12rem;}
    #contact ul li span.icon svg{height:3.5rem;}
    #contact ul li .txt{width:20.5rem;}
    #contact ul li h3{margin-top:0;}
    #contact .obj{width:85%;}
}