@import "fragment.css";

.content{position: relative;}
.sec_01{position: relative;}
.base_sec{padding-top: 80px;
    box-sizing: border-box;}
.main{max-width: 1400px; margin: 0 auto;z-index: 2;
    position: relative;}
.main .inner{position: relative; box-sizing: border-box;}
.main .inner .con{display: flex;
    height: 700px;
    align-items: center;
    justify-content: space-between;}
.main .textCon{}
.main .textCon *{font-family: 'Gmarket Sans', sans-serif;}
.main .textCon .subCon{display: flex;
    align-items: center; margin-bottom: 20px;}
.main .textCon .subCon img{width: 40px;
    margin-right: 10px;}
.main .textCon .title_list{width: 650px;
    overflow: hidden;padding-bottom: 10px;}
.main .textCon .title_list .list_inner{display: table;
    table-layout: fixed;}
.main .textCon .title_list .list_inner .unit{display: table-cell;}
.main .textCon .subCon span{font-size: 32px;}
.main .textCon .titleCon{}
.main .textCon .titleCon .title{display: inline-block;
    font-size: 62px;
    font-weight: 600;
    line-height: 1.2;}
.main .textCon .titleCon.pColor{color: #d11f1f;}
.main .textCon .titleCon > span{position: relative;
    display: inline-block;
    padding: 0 10px;}
.main .textCon .title_con_02 > span{padding: 0px;}
.main .mainLineBox{position: absolute;
    bottom: -15px;
    width: 100%;
    left: 0;
    padding: 0 15px;
    box-sizing: border-box;}
.main .mainLineBox .mainLineIn{position: relative;width: 100%;
    display: inline-block;}
.main .mainLineBox .mainLineIn .mainLine{-webkit-animation: line_r_animation 3s infinite;
    animation: line_r_animation 3s infinite;
    position: absolute;
    bottom:3px;width: 80%;
    height: 4px;
    background-color: #d11f1f;
    display: block;
    border-radius: 4px;}

@-webkit-keyframes line_r_animation {
    0%   {right: calc(2% + 100%); width: 0px;}
    35%   {right: calc(2% + 0px); width: 100%;}
    70%   {right: calc(2% + 0px); width: 0px;}
    100%   {right: calc(2% + 0px); width: 0px;}
}

@keyframes line_r_animation {
    0%   {right: calc(2% + 100%); width: 0px;}
    35%   {right: calc(2% + 0px); width: 100%;}
    70%   {right: calc(2% + 0px); width: 0px;}
    100%   {right: calc(2% + 0px); width: 0px;}
}

.main .inner .con .mainImg{width: 100%; max-width: 550px;}
.main .inner .con .mainImg img{width: 100%;}
.flw_btn_box{margin-top: 80px;
    display: flex;
    align-items: center;}
.flw_btn_box .flw_btn{width: 240px;
    margin-right: 10px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 400;
    border: 1px solid #141414;
    border-radius: 50px;
    box-sizing: border-box;
    font-family: 'Pretendard', sans-serif;}
.flw_btn_box .flw_btn:hover{background-color: #141414; color: white;}
.flw_btn_box .flw_btn span{width: 10px;
    height: 10px;
    background-color: #ff2828;
    border-radius: 10px;
    margin-right: 10px;}
.flw_btn_box .flw_btn.btn_act{background-color: #121212;
    color: white;}
.main_deco{position: absolute;
    top: 0;
    left: 30px;
    z-index: 1;
    height: 100%;}
.main_deco span{display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;}
.main_deco span img{width: 12px;}
.slogan{margin-top: 50px;}
.slogan MARQUEE{font-size: 120px;
    font-weight: 600;
    color: #f2f2f2;}
.main .page{display: flex;
    align-items: center; height: 60px;}
.main .page .pageCon{position: relative;
    margin-left: 20px;
    padding-right: 28px;}
.main .page .pageCon strong{font-size: 32px;
    font-weight: 600;}
.main .page .pageCon p{position: absolute;
    right: -0px;
    bottom: -10px;
    font-size: 18px;
    font-weight: 400;
    color: #b4b4b4;}
.main .page .arrowCon{display: flex;
    align-items: center; margin-right: 20px;}
.main .page .arrowCon button{width: 50px;
    height: 50px;
    background-color: white;
    border: 1px solid #141414;
    border-radius: 30px;
    padding: 5px;
    box-sizing: border-box;
    opacity: 0.2; cursor: pointer;}
.main .page .arrowCon button:hover{opacity: 1;}
.main .page .arrowCon button:first-child{transform: rotate(-90deg); margin-right: 10px;}
.main .page .arrowCon button:last-child{transform: rotate(90deg);}
.main .page .arrowCon button img{width: 35%;}
.main .page .pageLine{background-image: linear-gradient(to right, #dcdcdc 33%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 15px 4px;
    background-repeat: repeat-x;
    padding-bottom: 3px;
    width: 100%;}
.main_deco_02{position: absolute;
    top: 0;
    left: -200px;
    height: 100%;}
.main_deco_02 >div{display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;}
.main_deco_02 >div>div{width: 400px;
    height: 400px;
    background-color: #f5f5f5;
    border-radius: 200px;}
.youtube{margin-top: 200px; display: none;}
.youtube img{width: 100%;}
.scr_top{position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 2;}
.scr_top button{width: 50px;
    height: 50px;
    background-color: #141414;
    cursor: pointer;
    border: 1px solid white;}
.scr_top button img{width: 12px;}
.step_01{height: 100vh; width: 100%; box-sizing: border-box;}
.com_head{}
.com_head .inner{}
.com_head .sub_point{font-family: 'Gmarket Sans', sans-serif;
    color: #d11f1f;
    font-size: 22px;
    margin-bottom: 20px;}
.com_head .head_con{}
.com_head .head_con *{font-family: 'Gmarket Sans', sans-serif;}
.com_head .head_con h2{display: inline-block;
    font-size: 44px;
    font-weight: 600;
    line-height: 1.2;
    position: relative; z-index: 1;}
.com_head .head_con > span{position: relative; display: inline-block; margin-right: 10px;}
.com_head .head_con > span > span{position: absolute;
    width: 100%;
    height: 20px;
    background-color: #ffebb4;
    bottom: 0px;
    left: -10px;
    padding-right: 20px;}
.com_head .sub{font-size: 20px;
    line-height: 1.4;
    max-width: 600px;
    margin: 0 auto;
    margin-top: 40px;
    word-break: keep-all;}
.talk{margin-top: 60px;}
.talk .unit{display: flex;
    align-items: center;}
.talk .unit:last-child{justify-content: flex-end; margin-top: -40px;}
.talk .icon{width: 140px;}
.talk .unit:first-child .icon{margin-right: 20px;}
.talk .unit:last-child .icon{margin-left: 20px;}
.talk .text{padding: 20px;
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 10%);
    border-radius: 10px;
    font-size: 22px;
    font-weight: 400;}
.talk .text em{font-weight: 700;}
.step_02{background-color: #141414; height: 100vh; overflow: hidden; position: relative;}
.step_02 > div{height: 100%;}
.flex_center{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.com_head_wh h2{color: white;}
.com_head_wh .sub{color: #c8c8c8;
    font-weight: 100;}
.com_head_wh .head_con > span{margin-right: 0px!important; margin-left: 10px;}
.com_head_wh .head_con > span > span{background-color: #d11f1f;}
.sg_btn .sg_btn_box{justify-content: center;}
.sg_btn .sg_btn_box .btn_act_02{background-color: #d11f1f;
    color: white;margin-right: 0px;}
.sg_btn .sg_btn_box .btn_act_02 span{background-color: white;}
.stepLine{position: relative;}
.stepLine div{width: 1px;
    height: 50vh;
    background-color: rgba(255,255,255,0.2);
    margin: 0 auto;}
.stepLine span{margin: 0 auto;
    width: 16px;
    height: 16px;
    background-color: white;
    display: inline-block;
    position: absolute;
    bottom: 0px;
    margin-left: -8px;
    border-radius: 10px;}
.step_02 .inner{padding-top: 40px;}
.step_02 .sg_btn{padding-bottom: 40px;}
.step_03{margin-top: 120px;}
.step_03 .review{margin-top: 60px; padding: 0 80px; box-sizing: border-box;}
.step_03 .review .inner{position: relative;}
.step_03 .review .unit{opacity: 0.5;}
.step_03 .review .unit > div{position: relative;padding: 20px;
    box-sizing: border-box; padding-top: 60px;}
.step_03 .review .unit .face{position: absolute;text-align: center;
    width: 100%;
    top: 0px; left: 0px;}
.step_03 .review .unit .face img{width: 120px;
    margin: 0 auto;}
.step_03 .review .unit .con{padding: 30px;
    box-sizing: border-box;
    box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 10%);
    border-radius: 20px;}
.step_03 .review .unit .con .name{padding-top: 50px;
    text-align: center; display: inline-block; width: 100%;}
.step_03 .review .unit .con .name b{background-color: #141414;
    color: white;
    font-size: 18px;
    width: 80px;
    display: inline-block;
    height: 26px;
    line-height: 26px;
    font-weight: 600;}
.step_03 .review .unit .con .text{text-align: center;
    line-height: 1.4;
    font-weight: 300;
    margin-top: 20px;
    font-size: 16px;
    word-break: keep-all;}
.review .slick-prev,.review .slick-next{position: absolute;
    top: 50%;
    font-size: 0px;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #141414;
    box-sizing: border-box;
    background-color: white;
    cursor: pointer;}
.review .slick-prev{left: -80px;}
.review .slick-next{right: -80px;}
.step_03 .review .unit.slick-current{opacity: 1; transform: scale(1.1);}
.step_03 .review .slick-track{padding: 20px 0;}
.slick-prev:before, .slick-next:before{content: '→';
    color: black;
    font-size: 18px; font-weight: 300;}
.slick-prev:before{content: '←';}
.slick-next:before{content: '→';}
.review .slick-prev:hover,.review .slick-next:hover{background-color: #141414; color: white;}
.review .slick-prev:hover:before{color: white;}
.review .slick-next:hover:before{color: white;}
.review .ref{text-align: center;
    color: #a2a298;
    font-size: 16px;
    font-weight: 300;}
.step_03 .coop_list{    display: flex;
    flex-wrap: wrap;
    margin-top: 80px;
    padding-top: 40px;
    border-top: 1px solid #dcdcdc;}
.step_03 .coop_list > div{width: 16.66%;
    padding: 10px;
    box-sizing: border-box;}
.step_03 .coop_list > div > img{width: 100%;}
.step_04{background-color: #f2f2eb; margin-top: 120px;}
.step_04 .wait_con{display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 60px 0;}
.step_04 p{font-size: 28px;
    font-weight: 200;
    line-height: 1.4;}
.step_04 p em{font-weight: 600;}
.step_04 .flw_btn_box{margin-top: 0px;}

/* 포트폴리오 */
.sec_port{margin-bottom: 30vh;}
.port_head{margin-top: 20vh;}
.sub_head{display: flex;
    align-items: center;
    justify-content: space-between;}
.sub_head .head_02{font-size: 44px;
    font-weight: 600;
    min-width: 220px;}
.sub_head span{display: inline-block;
    width: 100%;
    height: 1px;
    background-color: #141414;}
.sec_port .cate_list{margin-top: 80px;}
.sec_port .cate_list ul{display: flex;
    align-items: center;}
.sec_port .cate_list ul li{font-family: 'Gmarket Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #c8c8c8;
    cursor: pointer;
    margin-right: 20px;}
.sec_port .cate_list ul li:hover{color: #141414;}
.sec_port .cate_list ul li.act{color: #d11f1f;}
.port_list{margin-top: 20px;}
.port_list .empty{font-size: 44px;
    font-weight: 600;
    color: #dcdcdc;
    margin-top: 200px;
    text-align: left;}
.port_list ul{display: flex;
    flex-wrap: wrap;}
.port_list ul li{padding: 5px;
    box-sizing: border-box;
    width: 25%;
    margin-bottom: 50px;}
.port_list ul li > span{padding: 50%;
    background-color: #f5f5f5;
    display: inline-block;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    transition: all .2s ease-in-out;
    cursor: pointer;}
.port_list ul li > span img{width: 100%;
    position: absolute;
    top: 0;
    left: 0;}
.port_list ul li p{text-align: center;
    font-size: 14px;
    font-weight: 400;
    color: #969696;
    margin-top: 5px;}
.port_list ul li:hover span{transform: scale(0.95);}
.port_list ul li:hover .itemText{color: #141414;}
.contact_head{height: 100vh;
    position: relative;
    display: flex;
    padding-left: 5vw;
    padding-top: 80px;
    box-sizing: border-box;}
.contact_head .con{padding-top: 25vh;}
.contact_head .scroll_down{position: absolute;
    left: 0;
    bottom: 20px;
    width: 100%;}
.contact_head .scroll_down .inner{display: flex;
    justify-content: center;}
.contact_head .scroll_down .inner img{width: 12px;}
.contact_head h3{font-family: 'Gmarket Sans', sans-serif;
    font-size: 120px;
    font-weight: 600;
    line-height: 1.2;
    position: relative;
    z-index: 2;}
.contact_head .cap{position: relative;
    display: inline-block;}
.contact_head .cap > span{position: absolute;
    top: -20px;
    right: -30px;
    width: 60px;
    height: 60px;
    background-color: #d11f1f;
    border-radius: 60px;}
.contact_sec{margin-bottom: 200px;}
.contact_sec .contact_inner{}
.contact_con{margin-top: 60px;}
.contact_con > .inner{max-width: 1000px;
    margin: 0 auto;
    box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 15%);
    overflow: hidden;
    width: 260px; transition: all .4s ease-in-out;}
.contact_con .title_con{padding: 30px 50px;
    display: flex;
    align-items: center;
    background-color: #141414;}
.contact_con .title_con span{width: 10px;
    height: 10px;
    background-color: #d11f1f;
    border-radius: 10px;}
.contact_con .title_con h4{font-family: 'Gmarket Sans', sans-serif;
    margin-left: 10px;
    color: white;
    font-size: 22px;
    font-weight: 600;}
.contact_con .list{border-bottom: 1px solid #dcdcdc;}
.contact_con .list .unit{padding: 0 50px;
    width: 100%;
    box-sizing: border-box;}
.contact_con .list .unit:last-child .unit_inner{border-bottom: none;}
.contact_con .list .unit .unit_inner{display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #dcdcdc;
    padding: 20px 0;}
.form_list{}
.form_list > .list_box{height: 0px; }
.form_list > .list_box > div{}
.contact_con .list .unit .title{font-family: 'Gmarket Sans', sans-serif;
    font-size: 18px;
    font-weight: 800;min-width: 200px;}
.contact_con .list .unit .input_con{width: 100%;
    display: flex;
    flex-wrap: wrap;}
.contact_con .list .unit .input_con label{margin-right: 5px;
    margin-bottom: 5px;}
.contact_con .list .unit .input_con .cont_cate{display: inline-block;
    height: 50px;
    line-height: 48px;
    background-color: white;
    border: 1px solid #dcdcdc;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    width: fit-content;
    padding: 0 20px;
    border-radius: 50px;
    cursor: pointer;
    color: #c8c8c8;
    box-sizing: border-box;}
.contact_con .list .unit .input_con .cont_input{width: 100%;
    border-radius: 10px;
    padding: 12px;
    box-sizing: border-box;
    font-size: 18px;
    height: 50px;
    border: none;}
.add_input{background-color: #f5f5f5; display: none;}
.add_input .inner{}
.add_input .unit{}
.add_input .inner .unit:last-child .unit_inner{border-bottom: none;}
.add_input .unit:first-child{}
.contact_con .list .unit .input_con input:checked+.cont_cate{background-color: #141414; color: white;}
.text_area{padding: 25px 50px;
    width: 100%;
    box-sizing: border-box;}
.text_area textarea{width: 100%;
    border: none;
    font-size: 18px;
    line-height: 1.4;
    resize: none;
    height: 200px;
    outline: none;
    padding-bottom: 20px;
    box-sizing: border-box;}
.contact_inner .privacy{max-width: 1000px;
    margin: 0 auto;
    margin-top: 60px;}
.contact_inner .privacy .priv_inner{}
.contact_inner .privacy .priv_inner .title{font-size: 15px;
    font-family: 'Gmarket Sans', sans-serif;
    font-weight: 600;
    margin-bottom: 10px;}
.contact_inner .privacy .priv_inner .form-control{max-height: 160px;
    overflow: auto;
    padding: 10px 0;
    border-top: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    color: #585858;
    line-height: 1.4;}
.contact_inner .privacy label{display: flex;
    align-items: center; cursor: pointer; width: fit-content;
    margin-top: 20px;}
.contact_inner .privacy label .chk_select{width: 16px;
    height: 16px;
    border: 1px solid #dcdcdc;
    border-radius: 16px;
    margin-right: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    box-sizing: border-box; transition: all .4s ease-in-out;}
.contact_inner .privacy label .chk_select > span{background-color: #d11f1f; transition: all .4s ease-in-out;}
.contact_inner .privacy label .copy{font-size: 14px;
    font-weight: 400;}
.contact_inner .privacy label input[name='priv_chk']:checked+.chk_select{border-color: #d11f1f;}
.contact_inner .privacy label input[name='priv_chk']:checked+.chk_select span{padding: 4px;
    box-sizing: border-box;
    background-color: #d11f1f;
    border-radius: 10px;}
.port_pop{position: fixed;
    display: none;
    top: 0;
    left: 0;
    background-color: white;
    z-index: 3;
    width: 100%;
    height: 100%;}
.port_pop .inner{display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;}
.port_pop .inner .cont{width: 100%;
    height: 100%; position: relative;}
.port_pop .close{
    position: absolute;
    top: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    box-sizing: border-box;
    padding: 14px;
    background-color: white;
    border-radius: 40px;
    cursor: pointer;
    box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 20%);}
.port_pop .close img{width: 100%;}
.port_pop .con_img{
    padding-top: 100px;
    box-sizing: border-box;
    height: 100%;
    overflow-y: auto;
    text-align: center;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;}
.port_pop .con_img img{width: 100%; max-width: 800px; margin: 0 auto;}
.text_limit{font-size: 16px;
    font-weight: 200;
    color: #b4b4b4;
    text-align: right;}
.cont_btn .flw_btn{margin-right: 0px;}
.cont_btn .stage{background-color: #141414; display: none; }
.contact_do .stage{display: flex;}
.contact_do .contact_btn{display: none;}


/* dot motion */
.dot-carousel {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: white;
    color: white;
    box-shadow: 9984px 0 0 0 red, 9999px 0 0 0 white, 10014px 0 0 0 blue;
    -webkit-animation: dot-carousel 1.5s infinite linear;
    animation: dot-carousel 1.5s infinite linear;
}



/* 청첩장 css */
.marriage{width: 100%;
    background-color: #f5f5f5;}
.marriage > .in{box-sizing: border-box;
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    background-color: white;}
.marriage .main{padding: 0px !important; box-sizing: border-box; width: 100%;}
.marriage .main .title{padding-top: 80px;}
.marriage .main .title h1{text-align: center;
    font-size: 50px;
    font-weight: bold;}
.marriage .main .title h2{font-size: 50px;
    text-align: center;
    margin-top: 20px;}
.marriage .main .img{margin-top: 60px;
    background-image: url("/static/client/images/marriage/main.jpg");
    height: 750px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;}
.marriage .main .img img{width: 100%;}
.marriage .main .sub{margin-top: 50px;
    padding: 0 50px; box-sizing: border-box;}
.marriage .main .sub .name{display: flex;
    justify-content: space-between;
    align-items: center;}
.marriage .main .sub .name span{
    width: 50%;
    height: 1px;
    background-color: black;}
.marriage .main .sub .name p{font-size: 28px;
    font-weight: bold;
    padding: 0 20px;
    min-width: 300px;
    text-align: center;
    letter-spacing: 10px;}
.marriage .main .sub > p{text-align: center;
    margin-top: 30px;
    font-size: 26px;
    font-weight: 200;
    line-height: 1.6;}
.marriage .invite{background-color: black;
    padding: 50px;
    box-sizing: border-box;
    margin-top: 80px;}
.marriage .invite .in{background-color: white;
    padding: 50px;
    box-sizing: border-box;
    box-shadow: 0px 0px 6px 6px rgb(0 0 0 / 3%);
    position: relative;}
.marriage .invite .invite_copy{text-align: center;
    font-size: 50px;
    color: white;
    padding-bottom: 30px;}
.marriage .invite .title{text-align: center;
    font-size: 32px;
    font-weight: bold;
    width: fit-content;
    margin: 0 auto;
    border-bottom: 1px solid #534741;
    padding-bottom: 10px;}
.marriage .invite .sub{max-width: 400px;
    margin: 0 auto;
    margin-top: 40px;
    text-align: center;
    line-height: 2;
    font-size: 20px;
    word-break: keep-all;
    font-weight: 200;}
.marriage .invite .sub em{font-weight: bold;}
.marriage .invite .chamfer{position: absolute;
    width: 80px;}
.marriage .invite .chamfer_01{top: 0;
    left: 0;}
.marriage .invite .chamfer_02{bottom: 0; right: 0; transform: rotate(180deg);}
.marriage .section05{padding: 0 50px; box-sizing: border-box;}
.marriage .contact{display: flex;
    justify-content: space-between;
    margin-top: 80px;}
.marriage .contact > div{width: 50%;
    text-align: center;
    padding: 30px 0;}
.marriage .contact > div:first-child{border-right: 1px solid #e6e6e6;
    box-sizing: border-box;}
.marriage .contact .tel_unit{margin-bottom: 60px;}
.marriage .contact .tel_unit > p{font-size: 16px;
    font-weight: 400;}
.marriage .contact .tel_unit > p em{font-size: 22px;
    font-weight: 600;}
.marriage .contact .tel_unit a{display: inline-block;
    width: 30px;
    cursor: pointer;
    height: 30px;
    margin-top: 20px;}
.marriage .contact .tel_unit a img{width: 100%;}
.marriage .contact .tel_parents{}
.marriage .contact .tel_parents .tel_unit:last-child{margin-bottom: 0px;}
.marriage .contact .tel_parents .parents_title{width: fit-content;
    margin: 0 auto;
    margin-bottom: 20px;
    border: 1px solid #534741;
    border-radius: 50px;
    padding: 8px 15px;
    font-size: 16px;}
.marriage .gallery{margin-top: 80px;}
.marriage .sub_title{text-align: center;
    font-size: 38px;
    letter-spacing: 10px;
    font-weight: bold;}
.marriage .gallery .list{display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;}
.marriage .gallery .list span{width: 32.33%;
    background-color: #f0f0f0;
    margin-bottom: 2%;
    cursor: pointer;}
.marriage .gallery .list span img{width: 100%;}
.marriage .map{margin-top: 80px;}
.marriage .map #map{margin-top: 40px;
    width: 100%;
    height: 260px;}
.marriage .map .mapBtn{width: 100%;
    border: none;
    height: 46px;
    line-height: 46px;
    background-color: black;
    color: white;
    font-size: 20px;}
.marriage .map .way{margin-top: 40px;}
.marriage .map .way > span{display: flex;
    align-items: center;
    margin-bottom: 20px;
    font-size: 24px;
    font-weight: 600;}
.marriage .map .way > span a{display: inline-block;
    width: 22px;
    height: 22px;
    margin-left: 10px;}
.marriage .map .way > span a img{width: 100%;}
.marriage .map .way > p{font-size: 16px;
    font-weight: 400;
    margin-bottom: 10px;}
.marriage .congrat{margin-top: 80px}
.marriage .congrat .in{border-top: 1px solid #534741; padding-top: 80px;}
.marriage .congrat .title{text-align: center;
    font-size: 28px;
    margin-bottom: 20px;
    font-weight: bold;}
.marriage .congrat small{text-align: center;
    width: 100%;
    display: inline-block;
    font-size: 18px;
    font-weight: 400;}
.marriage .congrat .alert{text-align: center;
    margin-top: 60px;
    color: #dc2828;
    font-size: 15px;
    word-break: keep-all;}
.marriage .congrat .btn_list{max-width: 400px;
    margin: 0 auto;
    margin-top: 20px;
    padding-bottom: 120px;
    display: flex;
    flex-wrap: wrap;}
.marriage .congrat .congrat_btn{width: 100%;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
    line-height: 70px;
    border: none;
    background-color: black;
    color: white;
    font-weight: 500;
    font-size: 22px;
    cursor: pointer;}
.marriage .congrat .congrat_btn img{width: 30px;
    margin-right: 10px;}
.marriage .congrat .congrat_btn_02{background-color: #f2f2f2;
    color: black; }
.marriage .congrat .congrat_btn_02 img{width: 40px;
    margin-right: 10px;}

.common_pop{position: fixed;
    display: none;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    z-index: 5;}
.common_pop .in{width: 100%;
    max-width: 400px;
    background-color: white;
    padding: 30px;
    box-sizing: border-box;
    text-align: right;}
.common_pop .close_btn{width: 20px;
    height: 20px;
    margin-bottom: 40px;
    border: none;}
.common_pop .close_btn img{width: 100%;}
.common_pop .title{font-size: 20px;
    font-weight: 500;
    margin-bottom: 40px;
    text-align: center; width: 100%;}
.pop_invite .list{}
.pop_invite .unit{margin-bottom: 30px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;}
.pop_invite .list .unit:first-child{border-top: none;}
.pop_invite .unit > p{font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
    width: 100%;
    text-align: left;}
.pop_invite .unit .text_input{width: 100%;
    border: 1px solid #dcdcdc;
    padding: 8px;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    outline: none;}
.pop_invite .unit .radio_list{display: flex;}
.pop_invite .unit label{display: flex;
    align-items: center;
    margin-right: 20px;}
.pop_invite .unit label p{font-size: 14px;
    margin-left: 4px;
    font-weight: 400;
    opacity: 0.5;}
.pop_invite .unit label .check_input:checked+p{
    opacity: 1;}
.pop_invite .submit_box{text-align: center;
    margin-top: 30px;
    margin-bottom: 20px;}
.pop_invite .submit_box .submit_btn{background-color: black;
    border: none;
    width: 220px;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
    font-weight: 500;
    color: white;}
.pop_invite .memo{width: 100%}
.pop_invite .memo textarea{width: 100%;
    border: 1px solid #dcdcdc;
    padding: 8px;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    outline: none;
    resize: none;
    height: 100px;
    line-height: 1.4;
    overflow-y: auto;}

.pop_account{position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.6);
    z-index: 6;}
.pop_account .list{background-color: #f2f2f2;
    padding: 20px;}
.pop_account .unit{display: flex;
    justify-content: space-between;
    margin-bottom: 15px;}
.pop_account .unit .name{font-size: 14px;
    font-weight: 400;}
.pop_account .unit .name em{font-size: 16px;
    font-weight: 500;}
.pop_account .unit .sub_title{}
.pop_account .unit .acc_val{display: flex;
    align-items: center;
    cursor: pointer;}
.pop_account .unit .acc_val .acc_name{font-size: 14px;
    margin-right: 5px; font-weight: 400;}
.pop_account .unit .acc_val .account_val{font-size: 14px;
    font-weight: 400;}
.pop_account .sub_title{margin: 0 auto;
    margin-bottom: 15px;
    font-size: 14px;
    border: 1px solid #534741;
    height: 26px;
    line-height: 26px;
    width: 90px;
    text-align: center;
    border-radius: 20px;
    margin-top: 20px;}
.pop_account .acc_list .unit:last-child{margin-bottom: 0px;}
.pop_account .list:last-child{margin-top: 10px;}
.copy_alert{position: fixed;
    transition: opacity .4s;
    opacity: 0;
    bottom: 30px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 5%;
    box-sizing: border-box;
    z-index: 7;}
.copy_alert .in{background-color: rgba(0,0,0,0.6);
    padding: 10px 20px;
    box-sizing: border-box;
    border-radius: 10px;
    width: 100%;
    max-width: 400px;
    text-align: center;}
.copy_alert .in p{color: white;
    font-size: 14px;
    font-weight: 400;}

.cat_invite{padding: 0 5%;
    position: relative;
    box-sizing: border-box;
    width: 100%; height: 100vh;}
.cat_invite .flower{position: absolute;
    width: 300px;}
.cat_invite .flower img{width: 100%;}
.cat_invite .flower_01{top: 0;
    left: 0;}
.cat_invite .flower_02{bottom: 0; right: 0;}
.cat_invite .in{display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;}
.cat_invite .unit{width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;}
.cat_invite .unit .title{text-align: center; width: 100%;}
.cat_invite .unit .title h1{font-weight: bold;
    font-size: 50px;
    text-align: center;}
.cat_invite .unit .title p{max-width: 400px;
    margin: 0 auto;
    margin-top: 20px;
    font-size: 20px;
    text-align: center;
    line-height: 1.4;
    font-weight: 300;}
.cat_invite .unit .title a{font-size: 22px;
    font-weight: 600;
    margin-top: 40px;
    display: inline-block;
    border-radius: 100px;
    background-color: #ff6400;
    color: white;
    width: 220px;
    height: 44px;
    line-height: 44px;}
.cat_invite .unit .cats{background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("/static/client/images/marriage/cats.png");
    height: 40vh;
    width: 40vh;
    margin-top: 10vh;}
.last{margin-top: 80px;}

.review_form{margin: 80px 0;}
.review_form .in{}
.review_form .in .logo{text-align: center;
    margin-bottom: 20px;}
.review_form .in .logo .review_logo{
    width: 180px;}
.review_form .in .sub_title{text-align: center;
    max-width: 340px;
    margin: 0 auto;
    margin-bottom: 40px;
    word-break: keep-all;
    color: #787878;
    line-height: 1.4;
    font-size: 16px;
    font-weight: 400;}
.review_form .in .title{text-align: center;
    font-size: 38px;
    font-weight: 600;
    margin-bottom: 60px;
    color: #1e1e1e;}
.review_form .in .rate_box{display: flex;
    justify-content: center;
    margin-bottom: 30px;}
.review_form .in .rate_box .rate_unit{display: flex;
    width: 40px;
    margin: 0 5px;}
.review_form .in .input_list{max-width: 480px;
    margin: 0 auto;
    box-shadow: 0px 0px 8px 0px rgb(0 0 0 / 10%);
    box-sizing: border-box;}
.review_form .in .input_list .input_head{display: flex;
    align-items: center;
    padding: 16px 24px;
    background-color: #1e1e1e;
    margin-bottom: 30px;}
.review_form .in .input_list .input_head .dot{width: 10px;
    height: 10px;
    border-radius: 20px;
    background-color: #d11f1f;}
.review_form .in .input_list .input_head .head{color: white;
    font-weight: 600;
    font-size: 20px;
    margin-left: 10px;}
.review_form .in .input_list .input_unit{margin-bottom: 30px;
    padding: 0 24px;}
.review_form .in .input_list .input_unit:last-child{margin-bottom: 0px;
    padding-bottom: 30px;}
.review_form .in .input_list .input_unit .head{font-size: 16px;
    margin-bottom: 5px;
    color: #b4b4b4;}
.review_form .in .input_list .input_unit .review_memo_box{position: relative;
    padding-bottom: 20px;}
.review_form .in .input_list .input_unit .review_memo_box .limit{position: absolute;
    bottom: 0;
    right: 0;
    color: #b4b4b4;
    font-size: 14px;
    font-weight: 400;}
.review_form .in .input_list .input_unit .head em{color: #d11f1f;
    font-size: 12px;
    margin-right: 2px;}
.review_form .in .input_list .input_unit .review_input{width: 100%;
    box-sizing: border-box;
    border: none;
    border-bottom: 1px solid #dcdcdc;
    padding: 10px 0;
    font-size: 18px;
    font-weight: 500;}
.review_form .in .input_list .input_unit .review_input.area{height: 180px;
    resize: none;
    border:none;
    outline: none;}
.review_form .in .reivew_agree_box{max-width: 480px;
    margin: 0 auto;
    margin-top: 30px;}
.review_form .in .reivew_agree_box .form-control{font-size: 14px;
    line-height: 1.2;
    color: #787878;
    border-top: 1px solid #dcdcdc;
    padding: 10px 0;
    border-bottom: 1px solid #dcdcdc;
    max-height: 120px;
    overflow: auto;}
.review_form .in .reivew_agree_box .form-control strong{line-height: 1.6;}
.review_form .in .reivew_agree_box label{display: flex;
    width: fit-content;
    margin-top: 10px;
    align-items: center;}
.review_form .in .reivew_agree_box label .agree_pick{display: none;}
.review_form .in .reivew_agree_box label .pick{width: 16px;
    height: 16px;
    border: 1px solid #dcdcdc;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    box-sizing: border-box;}
.review_form .in .reivew_agree_box label .pick .core{padding: 0px;
    transition: all .1s;
    border-radius: 10px;
    background-color: #d11f1f;}
.review_form .in .reivew_agree_box label .agree_pick:checked+.pick{border-color: #d11f1f;}
.review_form .in .reivew_agree_box label .agree_pick:checked+.pick .core{padding: 4px;}
.review_form .in .reivew_agree_box label .agree_title{font-size: 14px;
    margin-left: 5px;
    font-weight: 500;
    color: #505050;}
.review_form .in .review_btn_box{text-align: center;
    margin-top: 60px;}
.review_form .in .review_btn_box .review_btn{width: 180px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 500;
    border: none;
    border-radius: 50px;
    box-sizing: border-box;
    margin: 0 auto;
    border: 1px solid #1e1e1e;}
.review_end{    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;}
.review_end .in{margin-bottom: 10%;}
.review_end_title{font-size: 30px;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;}
.review_end_copy{font-size: 18px;
    font-weight: 400;
    margin-top: 20px;
    color: #787878;}






@-webkit-keyframes dot-carousel {
    0% {
        box-shadow: 9984px 0 0 -1px red, 9999px 0 0 1px white, 10014px 0 0 -1px blue;
    }
    50% {
        box-shadow: 10014px 0 0 -1px red, 9984px 0 0 -1px white, 9999px 0 0 1px blue;
    }
    100% {
        box-shadow: 9999px 0 0 1px red, 10014px 0 0 -1px white, 9984px 0 0 -1px blue;
    }
}

@keyframes dot-carousel {
    0% {
        box-shadow: 9984px 0 0 -1px white, 9999px 0 0 1px white, 10014px 0 0 -1px white;
    }
    50% {
        box-shadow: 10014px 0 0 -1px white, 9984px 0 0 -1px white, 9999px 0 0 1px white;
    }
    100% {
        box-shadow: 9999px 0 0 1px white, 10014px 0 0 -1px white, 9984px 0 0 -1px white;
    }
}
.successInner{padding: 0 5%;
    box-sizing: border-box;
    width: 100%; padding-top: 80px; height: 90vh;}
.successInner .sucTextBox{display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;}
.successInner .sucTextBox .sucHeadBox{text-align: center;}
.successInner .sucTextBox .sucHeadBox .sucHeadPoint{width: 60px;
    opacity: 0.1;
    margin: 0 auto;}
.successInner .sucTextBox .sucHeadBox .sucHead{font-family: 'Gmarket Sans', sans-serif;
    font-size: 40px;
    font-weight: 600;
    margin-top: 20px;}
.successInner .sucTextBox .sucSubCopy{text-align: center;
    margin-top: 20px;
    font-size: 22px;
    font-weight: 300;}
.successInner .sucTextBox .sucBtnList{}
.successInner .sucTextBox .sucBtnList .sucCloseBtn{}
.successInner .flw_btn_box{margin-top: 60px;}
.sub_link{max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding-bottom: 140px;
    box-sizing: border-box;}
.sub_link_inner{position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;}
.sub_link iframe{position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;}





@media (max-width:1199px){
    .main .textCon .title_list{width: 550px;}
    .main .textCon .titleCon .title{font-size: 48px;}
    .main .inner .con .mainImg{max-width: 450px;}
    .main .textCon .subCon span{font-size: 28px;}
    .main_deco{display: none;}
    .slogan MARQUEE{font-size: 80px;}
    .main .textCon .subCon img{width: 32px;}
    .step_03 .review .unit.slick-current{transform: scale(1);}
    .contact_head{padding-left: 0px;}
    .contact_head h3{font-size: 100px;}
    .contact_con > .inner{max-width: 800px;}
    .contact_inner .privacy{max-width: 800px;}

}

@media (max-width:1023px){
    .main .inner .con{flex-wrap: wrap;justify-content: center;height: 70vh;}
    .main .textCon{width: 100%;}
    .main .inner{height: auto;}
    .main .inner .con .mainImg{max-width: 420px;
        margin: 0 0 0 auto;
        margin-top: -120px;}
    .flw_btn_box{margin-top: 50px;}
    .main .textCon{position: relative; z-index: 2;}
    .com_head .head_con h2{font-size: 34px;}
    .com_head .sub_point{font-size: 18px; margin-bottom: 15px;}
    .com_head .sub{font-size: 16px;}
    .talk .icon{width: 100px;}
    .talk .unit:last-child{margin-top: 20px;}
    .talk .unit:last-child .text{text-align: right;}
    .talk .text{max-width: 50%; word-break: keep-all;
        line-height: 1.2; font-size: 18px;}
    .flw_btn_box .flw_btn{width: 220px;
        font-size: 18px;}
    .flw_btn_box .flw_btn span{width: 8px; height: 8px; margin-right: 6px;}
    .step_03 .coop_list > div{width: 25%;}
    .step_04 p{font-size: 20px;}
    .sub_head .head_02{font-size: 36px; min-width: 190px;}
    .sec_port .cate_list ul li{font-size: 16px;}
    .port_list ul li{width:33.33%;}
    .port_list ul li p{font-size: 12px; line-height: 1.2;}
    .contact_head h3{font-size: 80px;}
    .contact_head .cap > span{width: 40px;
        height: 40px;
        top: -8px;
        right: -12px;}
}

@media (max-width:767px){
    .main .textCon .subCon span{font-size: 22px;}
    .main .textCon .titleCon .title{font-size: 36px;}
    .main .textCon .subCon img{width: 24px;}
    .main .textCon .subCon{margin-bottom: 10px;}
    .main .textCon .title_list{width: 80vw;}
    .main .inner .con .mainImg{margin: 0 0 0 auto; margin-top: -60px; max-width: 60vw;}
    .main_deco_02 >div{align-items: flex-start; padding-top: 80px; box-sizing: border-box;}
    .step_03 .review{padding: 0 60px;}
    .review .slick-prev{left: -60px;}
    .review .slick-next{right: -60px;}
    .review .ref{font-size: 14px;}
    .step_03 .review .unit .con .text{font-size: 14px;}
    .step_03 .review .unit .con .name b{font-size: 16px;}
    .com_head .head_con h2{font-size: 32px;}
    .com_head .sub_point{font-size: 18px;}
    .slogan MARQUEE{font-size: 60px;}
    .talk .icon{width: 80px;}
    .talk .text{font-size: 16px;
        max-width: 55%;
        padding: 15px;}
    .com_head .sub{max-width: 400px; font-size: 16px;}
    .stepLine span{width: 10px; height: 10px; margin-left: -5px;}
    .main .inner .con{flex-wrap: wrap;
        align-content: center;}
    .contact_head h3{font-size: 60px;}
    .contact_head .cap > span{width: 30px;
        height: 30px;
        top: -6px;
        right: -8px;}
    .contact_con .title_con{padding: 20px 30px;}
    .contact_con .list .unit{padding: 0 30px;}
    .contact_con .title_con h4{font-size: 18px;}
    .contact_con .list .unit .title{font-size: 16px; min-width: 120px;}
    .contact_con .list .unit .input_con .cont_input{height: 40px;
        font-size: 16px;
        padding: 10px 0;}
    .contact_con .list .unit .input_con .cont_cate{font-size: 16px;
        height: 40px;
        line-height: 38px;}
    .text_area{padding: 20px 30px;}
    .text_area textarea{font-size: 16px;}
    .text_limit{font-size: 14px;}
    .successInner .sucTextBox .sucHeadBox .sucHeadPoint{width: 44px;}
    .successInner .sucTextBox .sucHeadBox .sucHead{font-size: 32px;}
    .successInner .sucTextBox .sucSubCopy{font-size: 20px;}

    /* 청첩장 */
    .marriage .main .title h2{font-size: 9vw;}
    .marriage .main .title h1{font-size: 9vw;}
    .marriage .section05{padding: 0 5%}
    .marriage .main .sub .name p{font-size: 26px; min-width: 280px;}
    .marriage .main .sub > p{font-size: 22px;}
    .marriage .invite .chamfer{width: 40px;}

    .review_form{padding: 0 5%;
        box-sizing: border-box;
        margin-top: 60px;
        margin-bottom: 120px;}
    .review_form .in .logo .review_logo{width: 120px;}
    .review_form .in .sub_title{font-size: 14px;}
    .review_form .in .rate_box .rate_unit{width: 10%;
        min-width: 30px;
        max-width: 40px;}
    .review_form .in .input_list .input_head{padding: 14px 20px;
        margin-bottom: 24px;}
    .review_form .in .input_list .input_head .head{font-size: 18px;
        margin-left: 6px;}
    .review_form .in .input_list .input_head .dot{width: 8px; height: 8px;}
    .review_form .in .input_list .input_unit{padding: 0 20px; argin-bottom: 24px;}
    .review_form .in .input_list .input_unit .head{font-size: 14px;}
    .review_form .in .input_list .input_unit .review_input{font-size: 16px;}
    .review_form .in .reivew_agree_box .form-control{font-size: 13px;}
    .review_end .in{margin-bottom: 30%;}
    .review_form .in .review_btn_box .review_btn{width: 160px;
        font-size: 18px;}
}
@media (max-width:479px){
    body .pd030{padding: 0 5%;}
    .main .textCon .titleCon .title{font-size: 28px;}
    .main .textCon .titleCon > span{padding: 0 5px;}
    .main .mainLineBox{padding: 0 5px;}
    .main .mainLineBox .mainLineIn .mainLine{height: 2px;}
    .main .textCon .subCon span{font-size: 16px;}
    .main .textCon .subCon img{width: 18px;
        margin-right: 6px;}
    .main .main_set{display: flex;
        height: 100vh;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-end;}
    .flw_btn_box .flw_btn{width: 160px;
        height: 45px;
        font-size: 14px;}
    .flw_btn_box{margin-top: 30px;}
    .main .inner .con .mainImg{max-width: 70vw;
        margin-top: 0px; margin-bottom: 2vh;}
    .main_deco_02{left: -25vw;}
    .main_deco_02 >div>div{
        width: 50vw; height: 50vw;}
    .main .inner .con{align-content: flex-end; min-height: 520px;}
    .main .page .arrowCon button{width: 40px; height: 40px;}
    .main .page .pageCon strong{font-size: 28px;}
    .main .page .pageCon p{font-size: 14px;}
    .main .page .pageCon{padding-right: 20px; margin-left: 10px;}
    .main .page .arrowCon{margin-right: 10px;}
    .main .textCon .title_list{width: 85vw;}
    .slogan{margin-top: 30px;}
    .slogan MARQUEE{font-size: 40px;}
    .com_head .sub_point{font-size: 15px;}
    .com_head .head_con h2{font-size: 24px;}
    .com_head .sub{font-size: 13px; margin-top: 30px;}
    .talk .icon{width: 60px; }
    .talk .text{font-size: 13px;}
    .talk .unit:first-child .icon{margin-right: 10px;}
    .talk .unit:last-child .icon{margin-left: 10px;}
    .talk{margin-top: 40px;}
    .step_03 .review .unit > div{padding: 10px; padding-top: 50px;}
    .step_03 .review{padding: 0 50px;}
    .review .slick-prev{left: -50px;}
    .review .slick-prev{left: -50px;}
    .review .slick-next{right: -50px;}
    .step_03 .review .unit .face img{width: 100px;}
    .step_03 .review .unit .con{padding: 20px;}
    .step_03 .review .unit .con .text{font-size: 13px; margin-top: 15px;}
    .step_03 .review .unit .con .name b{font-size: 14px;
        width: 60px;
        height: 22px;
        line-height: 22px;}
    .step_03 .review .unit .con .name{padding-top: 45px;}
    .review .ref{font-size: 13px; line-height: 1.2;}
    .step_03 .coop_list > div{width:33.33%;}
    .step_04 .wait_con{flex-wrap: wrap;}
    .step_04 p{margin-bottom: 20px;
        text-align: center;
        width: 100%;}
    .step_04 .wait_con{padding: 40px 0;}
    .step_04 .flw_btn_box{width: 100%;
        justify-content: center;}
    .sub_head .head_02{font-size: 26px; min-width: 140px;}
    .sec_port .cate_list{width: 100% !important; overflow-x:auto ; padding: 10px 0;}
    .sec_port .cate_list ul{width: max-content;}
    .port_list ul li{width: 50%; margin-bottom: 30px;}
    .port_pop .close{top: 15px;
        right: 15px;
        width: 40px;
        height: 40px;
        padding: 11px;}
    .port_pop .con_img{padding-left: 5%; padding-right: 5%; padding-top: 70px;}
    .contact_head h3{font-size: 50px;}
    .contact_head .con{padding-top: 30vh;}
    .contact_head .scroll_down .inner img{width: 10px;}
    .contact_con .list .unit .unit_inner{flex-wrap: wrap;
        padding: 15px 0;}
    .contact_con .list .unit .title{width: 100%;
        font-size: 12px;
        line-height: 30px;}
    .contact_con .list .unit{padding: 0 20px;}
    .contact_con .title_con{padding: 20px;}
    .contact_con .list .unit .input_con .cont_input{padding: 0px;
        height: 30px;
        line-height: 30px;
        font-size: 14px;}
    .contact_con .list .unit .input_con .cont_cate{height: 30px;
        font-size: 14px;
        line-height: 28px;}
    .text_area{padding: 20px;}
    .text_area textarea{font-size: 14px; height: 160px;}
    .contact_con .title_con h4{font-size: 16px;}
    .contact_inner .privacy .priv_inner .title{font-size: 14px;}
    .contact_inner .privacy .priv_inner .form-control{font-size: 12px; max-height: 120px;}
    .contact_inner .privacy label .copy{font-size: 12px;}
    .contact_inner .privacy{margin-top: 40px;}
    .cont_btn{margin-top: 60px;}
    .scr_top{bottom: 20px; right: 20px;}
    .scr_top button{width: 40px; height: 40px;}
    .scr_top button img{width: 10px;}
    .text_limit{font-size: 12px;}
    .successInner .sucTextBox .sucHeadBox .sucHeadPoint{width: 38px;}
    .successInner .sucTextBox .sucHeadBox .sucHead{font-size: 24px; margin-top: 15px;}
    .successInner .sucTextBox .sucSubCopy{font-size: 18px; margin-top: 10px;}
    .successInner .flw_btn_box{margin-top: 40px;}
    .successInner .sucTextBox > div{padding-bottom: 10vh;}
    .port_list .empty{margin-top: 100px; font-size: 24px;}

    .marriage .main .title{padding-top: 40px;}
    .marriage .main .img{margin-top: 0px;
        width: 100%;
        height: 65vh;}
    .marriage .main .sub .name p{font-size: 18px;
        min-width: 220px;}
    .marriage .main .sub > p{font-size: 18px;
        margin-top: 20px;
        line-height: 1.6;}
    .marriage .invite{margin-top: 60px;
        padding: 5%;}
    .marriage .invite .in{padding: 40px 30px;}
    .marriage .invite .invite_copy{font-size: 9vw;
        padding-top: 30px;
        padding-bottom: 20px;}
    .marriage .invite .title{font-size: 24px;}
    .marriage .invite .sub{font-size: 15px;
        margin-top: 30px;}
    .marriage .contact{margin-top: 60px;}
    .marriage .contact .tel_unit > p{font-size: 12px;}
    .marriage .contact .tel_unit > p em{font-size: 16px;}
    .marriage .contact .tel_unit a{
        width: 24px; height: 24px;}
    .marriage .contact .tel_parents .parents_title{font-size: 14px;
        padding: 6px 12px;}
    .marriage .gallery{margin-top: 60px;}
    .marriage .sub_title{font-size: 20px;}
    .marriage .gallery .list{margin-top: 30px;}
    .marriage .map #map{margin-top: 30px;}
    .marriage .map .mapBtn{font-size: 16px;
        height: 36px;
        line-height: 36px;}
    .marriage .map .way > span{font-size: 20px;}
    .marriage .map .way > span a{width: 18px;
        height: 18px;
        margin-left: 6px;}
    .marriage .map .way > p{font-size: 14px;}
    .marriage .congrat{margin-top: 60px;}
    .marriage .congrat .in{padding-top: 60px;}
    .marriage .congrat .title{font-size: 20px;}
    .marriage .congrat small{font-size: 16px;}
    .marriage .congrat .alert{font-size: 12px;
        line-height: 1.4;
        max-width: 220px;
        margin: 0 auto;
        margin-top: 40px;}
    .marriage .congrat .congrat_btn{font-size: 18px;
        height: 56px;
        line-height: 56px;}
    .marriage .congrat .congrat_btn img{width: 24px;}
    .marriage .congrat .congrat_btn_02 img{width: 30px;}
    .pop_invite{padding: 0 5%; box-sizing: border-box}
    .common_pop .title{font-size: 18px;
        line-height: 1.4;
        margin: 0 auto;
        margin-bottom: 20px;
        word-break: keep-all;}
    .pop_invite .unit > p{font-size: 12px;
        margin-bottom: 8px;}
    .pop_invite .unit .text_input{font-size: 12px;}
    .pop_invite .unit label p{font-size: 12px;
        margin-bottom: 5px;}
    .pop_invite .unit{margin-bottom: 24px;}
    .common_pop .close_btn{margin-bottom: 20px;}
    .pop_invite .memo textarea{font-size: 12px;
        height: 80px;}
    .pop_invite .submit_box{margin-bottom: 0px; margin-top: 0px;}
    .pop_account{padding: 0 5%; box-sizing: border-box;}
    .pop_account .unit .name em{font-size: 14px;}
    .pop_account .unit .name{font-size: 12px;}
    .pop_account .unit .acc_val .acc_name{font-size: 12px;}
    .pop_account .unit .acc_val .account_val{font-size: 12px;}
    .pop_account .sub_title{}
    .marriage .main .sub{padding: 0 5%; margin-top: 30px;}

    .cat_invite .unit .cats{margin-top: 6vh;
        width: 36vh; height: 36vh;}
    .cat_invite .unit .title h1{font-size: 8.5vw;}
    .cat_invite .unit .title p{font-size: 5vw; margin-top: 15px;}
    .cat_invite .unit .title a{font-size: 5vw;
        width: 180px;
        height: 36px;
        line-height: 36px;
        margin-top: 25px;}
    .cat_invite .flower{width: 45%;}
    .last{margin-top: 60px;}


}