@import url(reset.css);

/******** sub ********/

/************ iam ************/
@media screen and (min-width:961px) {
    #iam_wrap {
        width: 100%;
        overflow-x: auto;
        background: #fff;
    }

    .iam {
        width: 1200px;
        margin: 0 auto;
    }

    .img_1920 {
        width: 1920px;
        margin-left: -360px;
    }

    .img_1168 {
        width: 1168px;
        margin-left: 16px;
    }

    .iam>div>img {
        display: block;
    }

    .iam2 {
        padding: 65px 0;
    }

    .iam5 {
        padding-top: 74px;
    }

    /*
		.iam10{width:1920px; height:930px; margin-left:-360px;background:url(../images/iam/10.png) no-repeat; position:relative;}
			.iam10 a{display:block; width:233px; height:52px; position:absolute; top:400px; left:50%; margin-left:-116px;}
			.iam10 img{display:block; width:233px; height:52px;}*/
}

@media screen and (max-width: 960px) {
    #iam_wrap {
        width: 100%;
        overflow-x: hidden;
        background: #fff;
    }

    .iam {
        width: 100%;
        margin: 0 auto;
    }

    .iam>div>img {
        display: block;
        width: 100%;
    }

    .iam2 {
        margin: 10px 0;
    }

    .iam5 {
        margin-top: 10px;
    }
}


/** 상담신청 
	.councel{width:100%; height:762px; margin:0 auto; background:#eee; font-family:'Noto Sans KR', sans-serif; }
	.councel > article{width:980px; height:762px; margin:0 auto; padding-top:30px; position:relative;}
	.councel > article > form{width:1920px; margin-left:-470px;}
	ul.inputareas{overflow:hidden; width:980px; margin-left:470px;}
	.list_half{float:left;}
	.list_half2{margin-left:40px;}


		.councel h2{display:inline-block; color:#fb5624; font-weight:500;}
		.councel h3{display:block; width:980px; height:5px; background:#222950; margin-bottom:25px;}//밑줄

		.couslititle1{display:inline-block; width:156px; color:#222950; font-weight:500; font-size:19px;}
		.couslititle2{display:inline-block; width:150px; color:#222950; font-weight:500; font-size:19px; position:absolute; left:1px; margin-top:146px;}**/

/* input style 
			.liststyle1 > select{width:308px; height:42px; margin-bottom:30px; border:1px solid #bebebe;}
			.liststyle1 > input{width:306px; height:40px; margin-bottom:30px; border:1px solid #bebebe;}
			.liststyle2 > textarea{width:818px; height:176px; resize:none; border:1px solid #bebebe; margin-left:160px;}*/

/* 개인정보취급방침 
			.p_info{width:980px; font-size:15px; font-weight:500; color:#222950; margin:10px 0 33px 640px;}
			.p_info > a{display:inline-block; margin-left:30px; text-decoration:underline; color:#222950;}*/

/*send btn
			.submit{width:980px; padding-top:42px; border-top:1px solid #222950; margin:0 auto;}
			#button-blue{width:560px; height:67px; margin-left:210px; background:url(../images/iam/submit_go.png) no-repeat; border:none; text-indent:-5000px; overflow:hidden;}*/


/************ portfolio ************/
#portfolio_wrap {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow-x: auto;
    overflow-y: hidden;
    position: relative;
    background: #fff;
}

#portfolio_wrap [type=radio] {
    display: none;
}

#portfolio_wrap [type=checkbox] {
    display: none;
}

#portfolio_wrap label {
    cursor: pointer;
}

.portfolio_select>article {
    float: left;
}

/******* pc *******/
@media screen and (min-width:961px) {
    #portfolio_wrap>h2 {
        display: block;
        width: 1200px;
        margin: 0 auto;
    }

    #portfolio_wrap>h2>img {
        display: block;
        width: 1200px;
        height: 498px;
        margin-left: -38px;
    }

    .portfolio_select {
        width: 191px;
        position: absolute;
        left: 50%;
        margin: -90px 0 0 -140px;
        overflow: hidden;
    }

    .view {
        width: 100px;
        height: 50px;
    }

    .view>img {
        width: 100px;
        height: 50px;
    }

    /*** line0_dvcps ***/
    /* port_dvcps :다빈치 */
    #port_dvcps~div.line0_dvcps>.port_dvcps_wrap>article.port_dvcps_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port_dvcps:checked~div.line0_dvcps>.port_dvcps_wrap>article.port_dvcps_con_wrap {
        height: 1453px;
        /*** 이미지높이+margin(60)+화살표높이(50) ***/

        position: absolute;
        transition-duration: 0.5s;
    }

    .port_dvcps_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_dvcps_con_wrap>.view {
        margin-left: 56%;
    }

    .port_dvcps_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port_dvcps_label_wrap {
        width: 100%;
        height: 806px;
        background: #fef3f4;
    }

    .port_dvcps_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port_dvcps_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 456px;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port_dvcps_label_wrap>div>label img {
        display: block;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -180px;
    }

    .port_dvcps_con {
        width: 100%;
        background: #3a3a3a;
        height: 1453px;
        margin: 0 auto;
        text-align: center;
    }

    .port_dvcps_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port_dvcps_con>img:last-child {
        margin-right: 0;
    }

    /*** line0 ***/
    #port_dvcps:checked~.line0 section {
        margin-top: 1360px;
        transition-duration: 0.5s;
    }

    /* port0 :메이크 */
    #port0~div.line0>.port0_wrap>article.port0_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port0:checked~div.line0>.port0_wrap>article.port0_con_wrap {
        height: 944px;
        /*** 이미지높이+margin(60)+화살표높이(50) ***/

        position: absolute;
        transition-duration: 0.5s;
    }

    .port0_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port0_con_wrap>.view {
        margin-left: 56%;
    }

    .port0_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port0_label_wrap {
        width: 100%;
        height: 806px;
        background: #cadee6;
    }

    .port0_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port0_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port0_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 456px;
    }

    .port0_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port0_label_wrap>div>label img {
        display: block;
    }

    .port0_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -180px;
    }

    .port0_con {
        width: 100%;
        background: #3a3a3a;
        height: 907px;
        margin: 0 auto;
        text-align: center;
    }

    .port0_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port0_con>img:last-child {
        margin-right: 0;
    }

    /*** line3-2 :리파인 ***/
    #port0:checked~.line01 section {
        margin-top: 894px;
        transition-duration: 0.5s;
    }

    /* port01 */
    #port01~div.line01>.port01_wrap>article.port01_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port01:checked~div.line01>.port01_wrap>article.port01_con_wrap {
        height: 716px;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port01_label_wrap {
        width: 100%;
        height: 896px;
        background: #d6cfec;
    }

    .port01_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port01_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port01_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 418px;
    }

    .port01_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port01_label_wrap>div>label img {
        display: block;
    }

    .port01_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -200px;
    }

    .port01_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port01_con_wrap>.view {
        margin-left: 58%;
    }

    .port01_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port01_con {
        width: 100%;
        background: #3a3a3a;
        height: 769px;
        margin: 0 auto;
        text-align: center;
    }

    .port01_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port01_con>img:last-child {
        margin-right: 0;
    }

    /*** line1 :라르떼 ***/
    #port01:checked~.line1>section {
        margin-top: 666px;
        /*** 윗높이-화살표높이(50) ***/
        transition-duration: 0.5s;
    }

    /* port1 */
    #port1~div.line1>.port1_wrap>article.port1_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port1:checked~div.line1>.port1_wrap>article.port1_con_wrap {
        height: 1053px;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port1_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port1_con_wrap>.view {
        margin-left: 56%;
    }

    .port1_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port1_label_wrap {
        width: 100%;
        height: 806px;
        background: #fef3f4;
    }

    .port1_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port1_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port1_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 456px;
    }

    .port1_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port1_label_wrap>div>label img {
        display: block;
    }

    .port1_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -180px;
    }

    .port1_con {
        width: 100%;
        background: #3a3a3a;
        height: 1053px;
        margin: 0 auto;
        text-align: center;
    }

    .port1_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port1_con>img:last-child {
        margin-right: 0;
    }


    /*** line2 :쥬벤스 ***/
    #port1:checked~.line2>section {
        margin-top: 1003px;
        transition-duration: 0.5s;
    }

    /* port2 */
    #port2~div.line2>.port2_wrap>article.port2_con_wrap {
        width: 100%;
        height: 0px;
        position: absolute;
        left: 0;
        right: 0;
    }

    #port2:checked~div.line2>.port2_wrap>article.port2_con_wrap {
        height: 967px;
        transition-duration: 0.5s;
    }

    .port2_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port2_con_wrap>.view {
        margin-left: 57%;
    }

    .port2_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port2_label_wrap {
        width: 100%;
        height: 806px;
        background: #d5ece6;
    }

    .port2_label_wrap>div {
        width: 1240px;
        margin: 0 auto;
    }

    .port2_label_wrap>div>label {
        display: inline-block;
        margin-top: 110px;
    }

    .port2_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 424px;
    }

    .port2_label_wrap>div>label:nth-of-type(2) {
        width: 790px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port2_label_wrap>div>label img {
        display: block;
    }

    .port2_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -200px;
    }

    .port2_con {
        width: 100%;
        background: #3a3a3a;
        height: 967px;
        margin: 0 auto;
        text-align: center;
    }

    .port2_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port2_con>img:last-child {
        margin-right: 0;
    }


    /*** line3 :연플 ***/
    #port2:checked~.line3>section {
        margin-top: 917px;
        transition-duration: 0.5s;
    }

    /* port3 */
    #port3~div.line3>.port3_wrap>article.port3_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3:checked~div.line3>.port3_wrap>article.port3_con_wrap {
        height: 769px;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3_label_wrap {
        width: 100%;
        height: 806px;
        background: #d6cfec;
    }

    .port3_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port3_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port3_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 418px;
    }

    .port3_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port3_label_wrap>div>label img {
        display: block;
    }

    .port3_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -200px;
    }

    .port3_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port3_con_wrap>.view {
        margin-left: 56%;
    }

    .port3_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port3_con {
        width: 100%;
        background: #3a3a3a;
        height: 769px;
        margin: 0 auto;
        text-align: center;
    }

    .port3_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port3_con>img:last-child {
        margin-right: 0;
    }

    /*** line3-1 :센트리얼 ***/
    #port3:checked~.line3-1 section {
        margin-top: 719px;
        transition-duration: 0.5s;
    }

    /* port3-1 */
    #port3-1~div.line3-1>.port3-1_wrap>article.port3-1_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3-1:checked~div.line3-1>.port3-1_wrap>article.port3-1_con_wrap {
        height: 650px;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3-1_label_wrap {
        width: 100%;
        height: 896px;
        background: #cadee6;
    }

    .port3-1_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port3-1_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port3-1_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 418px;
    }

    .port3-1_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port3-1_label_wrap>div>label img {
        display: block;
    }

    .port3-1_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -200px;
    }

    .port3-1_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port3-1_con_wrap>.view {
        margin-left: 58%;
    }

    .port3-1_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port3-1_con {
        width: 100%;
        background: #3a3a3a;
        height: 769px;
        margin: 0 auto;
        text-align: center;
    }

    .port3-1_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port3-1_con>img:last-child {
        margin-right: 0;
    }


    /* port3-1 */
    #port3-1:checked~.line3-2 section {
        margin-top: 600px;
        transition-duration: 0.5s;
    }

    #port3-2~div.line3-2>.port3-2_wrap>article.port3-2_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3-2:checked~div.line3-2>.port3-2_wrap>article.port3-2_con_wrap {
        height: 1100px;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3-2_label_wrap {
        width: 100%;
        height: 896px;
        background: #fef3f4;
    }

    .port3-2_label_wrap>div {
        width: 1280px;
        margin: 0 auto;
    }

    .port3-2_label_wrap>div>label {
        display: inline-block;
        margin-top: 100px;
    }

    .port3-2_label_wrap>div>label:nth-of-type(1) {
        width: 320px;
        height: 418px;
    }

    .port3-2_label_wrap>div>label:nth-of-type(2) {
        width: 866px;
        cursor: pointer;
        margin-left: 80px;
    }

    .port3-2_label_wrap>div>label img {
        display: block;
    }

    .port3-2_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: -200px;
    }

    .port3-2_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port3-2_con_wrap>.view {
        margin-left: 58%;
    }

    .port3-2_con_wrap>.view>img {
        background: #3a3a3a;
    }

    .port3-2_con {
        width: 100%;
        background: #3a3a3a;
        height: 1050px;
        margin: 0 auto;
        text-align: center;
    }

    .port3-2_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .port3-2_con>img:last-child {
        margin-right: 0;
    }






    /*** line4 :타임,수원시의사회,나인 ***/
    #port3-2:checked~.line4 section {
        margin-top: 1050px;
        transition-duration: 0.5s;
    }

    .line4 {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        background: #fef3f4;
    }

    .line4>div {
        width: 1100px;
        margin: 0 auto;
    }

    .line4>div>section {
        display: inline-block;
        width: 360px;
    }

    .line4_label_wrap {
        width: 100%;
        margin: 0 auto;
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .line4 label {
        display: block;
        width: 360px;
        text-align: center;
        margin: 0 auto;
    }

    .line4 label>img {
        display: block;
        margin: 0 auto;
        width: 360px;
    }

    .line4 .view {
        background: #fef3f4;
    }

    .line4_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 30px;
    }

    .line4_con>img:last-child {
        margin-right: 0;
    }

    .line4 .view {
        width: 100%;
        margin: 0 auto;
    }

    .line4 .view>img {
        width: 100px;
        height: 50px;
        position: absolute;
        left: 50%;
        background: #3a3a3a;
    }

    /* port4 */
    #port4~div.line4 .port4_wrap>article.port4_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port4:checked~div.line4 .port4_wrap>article.port4_con_wrap {
        height: 844px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port4_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port4_con_wrap>.view>img {
        margin-left: -420px;
    }

    .port4_con {
        width: 100%;
        background: #3a3a3a;
        height: 844px;
        margin: 0 auto;
        text-align: center;
    }

    /* port5 */
    #port5~div.line4 .port5_wrap>article.port5_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port5:checked~div.line4 .port5_wrap>article.port5_con_wrap {
        height: 557px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port5_wrap label {
        margin-left: 20px;
    }

    .port5_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port5_con_wrap>.view>img {
        margin-left: -30px;
    }

    .port5_con {
        width: 100%;
        background: #3a3a3a;
        height: 557px;
        margin: 0 auto;
        text-align: center;
    }

    /* port6 */
    #port6~div.line4 .port6_wrap>article.port6_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port6:checked~div.line4 .port6_wrap>article.port6_con_wrap {
        height: 716px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port6_wrap label {
        margin-left: 40px;
    }

    .port6_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port6_con_wrap>.view>img {
        margin-left: 360px;
    }

    .port6_con {
        width: 100%;
        background: #3a3a3a;
        height: 716px;
        margin: 0 auto;
        text-align: center;
    }

    /*** line5 :아이조아,바라본,아이두 ***/
    /* margin-top:전이미지높이+padding(45) */
    #port4:checked~.line5 section {
        margin-top: 839px;
        transition-duration: 0.5s;
    }

    #port5:checked~.line5 section {
        margin-top: 552px;
        transition-duration: 0.5s;
    }

    #port6:checked~.line5 section {
        margin-top: 711px;
        transition-duration: 0.5s;
    }

    .line5 {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        background: #d5ece6;
    }

    .line5>div {
        width: 1100px;
        margin: 0 auto;
    }

    .line5>div>section {
        display: inline-block;
        width: 360px;
    }

    .line5_label_wrap {
        width: 100%;
        margin: 0 auto;
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .line5 label {
        display: block;
        width: 360px;
        text-align: center;
        margin: 0 auto;
    }

    .line5 label>img {
        display: block;
        margin: 0 auto;
        width: 360px;
    }

    .line5 .view {
        background: #d5ece6;
        width: 100%;
        margin: 0 auto;
    }

    .line5_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .line5_con>img:last-child {
        margin-right: 0;
    }

    .line5 .view {
        width: 100%;
        margin: 0 auto;
    }

    .line5 .view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
    }

    /* port7 */
    #port7~div.line5 .port7_wrap>article.port7_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port7:checked~div.line5 .port7_wrap>article.port7_con_wrap {
        height: 617px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port7_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port7_con_wrap>.view>img {
        margin-left: -420px;
    }

    .port7_con {
        width: 100%;
        background: #3a3a3a;
        height: 617px;
        margin: 0 auto;
        text-align: center;
    }

    /* port8 */
    #port8~div.line5 .port8_wrap>article.port8_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port8:checked~div.line5 .port8_wrap>article.port8_con_wrap {
        height: 876px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port8_wrap label {
        margin-left: 20px;
    }

    .port8_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port8_con_wrap>.view>img {
        margin-left: -30px;
    }

    .port8_con {
        width: 100%;
        background: #3a3a3a;
        height: 876px;
        margin: 0 auto;
        text-align: center;
    }

    .port8_con>img {}

    /* port9 */
    #port9~div.line5 .port9_wrap>article.port9_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port9:checked~div.line5 .port9_wrap>article.port9_con_wrap {
        height: 794px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port9_wrap label {
        margin-left: 40px;
    }

    .port9_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port9_con_wrap>.view>img {
        background: #3a3a3a;
        margin-left: 360px;
    }

    .port9_con {
        width: 100%;
        background: #3a3a3a;
        height: 794px;
        margin: 0 auto;
        text-align: center;
    }

    /*** line6 :청담엔비,밝은얼굴,압구정역jyp ***/
    /* margin-top:전이미지높이 */
    #port7:checked~.line6 section {
        margin-top: 617px;
        transition-duration: 0.5s;
    }

    #port8:checked~.line6 section {
        margin-top: 876px;
        transition-duration: 0.5s;
    }

    #port9:checked~.line6 section {
        margin-top: 794px;
        transition-duration: 0.5s;
    }

    .line6 {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        background: #d6cfec;
    }

    .line6>div {
        width: 1100px;
        margin: 0 auto;
    }

    .line6>div>section {
        display: inline-block;
        width: 360px;
    }

    .line6_label_wrap {
        width: 100%;
        margin: 0 auto;
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .line6 label {
        display: block;
        width: 360px;
        text-align: center;
        margin: 0 auto;
    }

    .line6 label>img {
        display: block;
        margin: 0 auto;
        width: 360px;
    }

    .line6 .view {
        background: #d6cfec;
    }

    .line6_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .line6_con>img:last-child {
        margin-right: 0;
    }

    .line6 .view {
        width: 100%;
        margin: 0 auto;
    }

    .line6 .view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
    }

    /* port10 */
    #port10~div.line6 .port10_wrap>article.port10_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port10:checked~div.line6 .port10_wrap>article.port10_con_wrap {
        height: 541px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port10_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port10_con_wrap>.view>img {
        margin-left: -420px;
    }

    .port10_con {
        width: 100%;
        background: #3a3a3a;
        height: 541px;
        margin: 0 auto;
        text-align: center;
    }

    /* port11 */
    #port11~div.line6 .port11_wrap>article.port11_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port11:checked~div.line6 .port11_wrap>article.port11_con_wrap {
        height: 640px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port11_wrap label {
        margin-left: 20px;
    }

    .port11_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port11_con_wrap>.view>img {
        margin-left: -30px;
    }

    .port11_con {
        width: 100%;
        background: #3a3a3a;
        height: 640px;
        margin: 0 auto;
        text-align: center;
    }

    .port11_con>img {}

    /* port12 */
    #port12~div.line6 .port12_wrap>article.port12_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port12:checked~div.line6 .port12_wrap>article.port12_con_wrap {
        height: 461px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port12_wrap label {
        margin-left: 40px;
    }

    .port12_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port12_con_wrap>.view>img {
        margin-left: 360px;
    }

    .port12_con {
        width: 100%;
        background: #3a3a3a;
        height: 794px;
        margin: 0 auto;
        text-align: center;
    }

    /*** line7 :강남미,미래지안,달란트 ***/
    /* margin-top:전이미지높이 */
    #port10:checked~.line7 section {
        margin-top: 541px;
        transition-duration: 0.5s;
    }

    #port11:checked~.line7 section {
        margin-top: 640px;
        transition-duration: 0.5s;
    }

    #port12:checked~.line7 section {
        margin-top: 461px;
        transition-duration: 0.5s;
    }

    .line7 {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        background: #fef3f4;
    }

    .line7>div {
        width: 1100px;
        margin: 0 auto;
    }

    .line7>div>section {
        display: inline-block;
        width: 360px;
    }

    .line7_label_wrap {
        width: 100%;
        margin: 0 auto;
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .line7 label {
        display: block;
        width: 360px;
        text-align: center;
        margin: 0 auto;
    }

    .line7 label>img {
        display: block;
        margin: 0 auto;
        width: 360px;
    }

    .line7 .view {
        background: #fef3f4;
    }

    .line7_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .line7_con>img:last-child {
        margin-right: 0;
    }

    .line7 .view {
        width: 100%;
        margin: 0 auto;
    }

    .line7 .view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
    }

    /* port13 */
    #port13~div.line7 .port13_wrap>article.port13_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port13:checked~div.line7 .port13_wrap>article.port13_con_wrap {
        height: 635px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port13_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port13_con_wrap>.view>img {
        margin-left: -420px;
    }

    .port13_con {
        width: 100%;
        background: #3a3a3a;
        height: 635px;
        margin: 0 auto;
        text-align: center;
    }

    /* port14 */
    #port14~div.line7 .port14_wrap>article.port14_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port14:checked~div.line7 .port14_wrap>article.port14_con_wrap {
        height: 731px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port14_wrap label {
        margin-left: 20px;
    }

    .port14_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port14_con_wrap>.view>img {
        margin-left: -30px;
    }

    .port14_con {
        width: 100%;
        background: #3a3a3a;
        height: 731px;
        margin: 0 auto;
        text-align: center;
    }

    .port14_con>img {}

    /* port15 */
    #port15~div.line7 .port15_wrap>article.port15_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port15:checked~div.line7 .port15_wrap>article.port15_con_wrap {
        height: 705px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port15_wrap label {
        margin-left: 40px;
    }

    .port15_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port15_con_wrap>.view>img {
        margin-left: 360px;
    }

    .port15_con {
        width: 100%;
        background: #3a3a3a;
        height: 705px;
        margin: 0 auto;
        text-align: center;
    }

    /*** line8 :오렌지,강남k뷰티,에스원 ***/
    /* margin-top:전이미지높이 */
    #port13:checked~.line8 section {
        margin-top: 635px;
        transition-duration: 0.5s;
    }

    #port14:checked~.line8 section {
        margin-top: 731px;
        transition-duration: 0.5s;
    }

    #port15:checked~.line8 section {
        margin-top: 705px;
        transition-duration: 0.5s;
    }

    .line8 {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
        background: #d5ece6;
    }

    .line8>div {
        width: 1100px;
        margin: 0 auto;
    }

    .line8>div>section {
        display: inline-block;
        width: 360px;
    }

    .line8_label_wrap {
        width: 100%;
        margin: 0 auto;
        margin-top: 30px;
        padding-bottom: 30px;
    }

    .line8 label {
        display: block;
        width: 360px;
        text-align: center;
        margin: 0 auto;
    }

    .line8 label>img {
        display: block;
        margin: 0 auto;
        width: 360px;
    }

    .line8 .view {
        background: #d5ece6;
    }

    .line8_con>img {
        display: inline-block;
        width: 550px;
        margin: 0 auto;
        margin-top: 30px;
        margin-right: 20px;
    }

    .line8_con>img:last-child {
        margin-right: 0;
    }

    .line8 .view {
        width: 100%;
        margin: 0 auto;
    }

    .line8 .view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
    }

    /* port16 */
    #port16~div.line8 .port16_wrap>article.port16_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port16:checked~div.line8 .port16_wrap>article.port16_con_wrap {
        height: 727px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port16_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port16_con_wrap>.view>img {
        margin-left: -420px;
    }

    .port16_con {
        width: 100%;
        background: #3a3a3a;
        height: 727px;
        margin: 0 auto;
        text-align: center;
    }

    /* port17 */
    #port17~div.line8 .port17_wrap>article.port17_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port17:checked~div.line8 .port17_wrap>article.port17_con_wrap {
        height: 715px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port17_wrap label {
        margin-left: 20px;
    }

    .port17_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port17_con_wrap>.view>img {
        margin-left: -30px;
    }

    .port17_con {
        width: 100%;
        background: #3a3a3a;
        height: 715px;
        margin: 0 auto;
        text-align: center;
    }

    .port17_con>img {}

    /* port18 */
    #port18~div.line8 .port18_wrap>article.port18_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port18:checked~div.line8 .port18_wrap>article.port18_con_wrap {
        height: 595px;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port18_wrap label {
        margin-left: 40px;
    }

    .port18_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port18_con_wrap>.view>img {
        margin-left: 360px;
    }

    .port18_con {
        width: 100%;
        background: #3a3a3a;
        height: 595px;
        margin: 0 auto;
        text-align: center;
    }

    /*** line_last ***/
    /* margin-top:전이미지높이-3px */
    #port16:checked~.line_last section {
        margin-top: 724px;
        transition-duration: 0.5s;
    }

    #port17:checked~.line_last section {
        margin-top: 712px;
        transition-duration: 0.5s;
    }

    #port18:checked~.line_last section {
        margin-top: 592px;
        transition-duration: 0.5s;
    }

    .line_last {
        margin-top: -20px;
    }

}

/******* mobile *******/
@media screen and (max-width:960px) {
    #portfolio_wrap {
        overflow-x: hidden;
    }

    #portfolio_wrap>h2 {
        display: block;
        width: 90%;
        margin: 0 auto;
        margin-bottom: 50px;
    }

    #portfolio_wrap>h2>img {
        display: block;
        width: 100%;
    }

    .portfolio_select {
        width: 191px;
        position: absolute;
        left: 50%;
        margin: -60px 0 0 -95px;
        overflow: hidden;
    }

    .view {
        width: 100%;
        height: 50px;
    }

    .view>img {
        width: 100px;
        height: 50px;
    }

    /*** line0_dvcps :다빈치 ***/
    /* port0 */
    #port_dvcps~div.line0_dvcps>.port_dvcps_wrap>article.port_dvcps_con_wrap {
        width: 100%;
        height: 0px;
        position: absolute;
        left: 0;
        right: 0;
    }

    #port_dvcps:checked~div.line0_dvcps>.port_dvcps_wrap>article.port_dvcps_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
    }

    .port_dvcps_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_dvcps_con_wrap>.view {
        background: #fef3f4;
    }

    .port_dvcps_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_dvcps_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
    }

    .port_dvcps_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port_dvcps_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port_dvcps_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_dvcps_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_dvcps_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port_dvcps_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }


    /*** line0 :메이크 ***/
    #port_dvcps:checked~.line0 section {
        margin-top: 122%;
        transition-duration: 0.4s;
    }

    /* port0 */
    #port0~div.line0>.port0_wrap>article.port0_con_wrap {
        width: 100%;
        height: 0px;
        position: absolute;
        left: 0;
        right: 0;
    }

    #port0:checked~div.line0>.port0_wrap>article.port0_con_wrap {
        height: 15%;
        transition-duration: 0.5s;
    }

    .port0_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port0_con_wrap>.view {
        background: #cadee6;
    }

    .port0_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port0_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #cadee6;
        position: relative;
    }

    .port0_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port0_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port0_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port0_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port0_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port0_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port0_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port0_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line01 :리파인 ***/
    #port0:checked~.line01 section {
        margin-top: 78%;
        transition-duration: 0.4s;
    }

    /* port01 */
    #port01~div.line01>.port01_wrap>article.port01_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port01:checked~div.line01>.port01_wrap>article.port01_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port01_label_wrap {
        width: 100%;
        padding-bottom: 30px;
        background: #d6cfec;
        position: relative;
        z-index: 1;
    }

    .port01_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port01_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port01_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port01_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port01_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port01_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }


    .port01_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -30px;
    }

    .port01_con_wrap>.view {
        background: #d6cfec;
    }

    .port01_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port01_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port01_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line1 :라르떼 ***/
    #port01:checked~.line1>section {
        margin-top: 64%;
        transition-duration: 0.4s;
    }

    /* port1 */
    #port1~div.line1>.port1_wrap>article.port1_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port1:checked~div.line1>.port1_wrap>article.port1_con_wrap {
        height: 15%;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port1_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port1_con_wrap>.view {
        background: #cadee6;
    }

    .port1_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port1_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
        z-index: 1;
    }

    .port1_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port1_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port1_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port1_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port1_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port1_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }

    .port1_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port1_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }


    /*** line2 :쥬벤스 ***/
    #port1:checked~.line2>section {
        margin-top: 88%;
        transition-duration: 0.4s;
    }

    /* port2 */
    #port2~div.line2>.port2_wrap>article.port2_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port2:checked~div.line2>.port2_wrap>article.port2_con_wrap {
        height: 15%;
        position: absolute;
        transition-duration: 0.5s;
    }

    .port2_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port2_con_wrap>.view {
        background: #cadee6;
    }

    .port2_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port2_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d5ece6;
        position: relative;
        z-index: 1;
    }

    .port2_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port2_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port2_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port2_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port2_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port2_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }

    .port2_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port2_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }


    /*** line3 :연플 ***/
    #port2:checked~.line3>section {
        margin-top: 81%;
        transition-duration: 0.4s;
    }

    /* port3 */
    #port3~div.line3>.port3_wrap>article.port3_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3:checked~div.line3>.port3_wrap>article.port3_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3_label_wrap {
        width: 100%;
        padding-bottom: 30px;
        background: #d6cfec;
        position: relative;
        z-index: 1;
    }

    .port3_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port3_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port3_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port3_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port3_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port3_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }


    .port3_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -30px;
    }

    .port3_con_wrap>.view {
        background: #d6cfec;
    }

    .port3_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port3_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port3_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line3-1 :센트리얼 ***/
    #port3:checked~.line3-1 section {
        margin-top: 68%;
        transition-duration: 0.4s;
    }

    /* port3-1 */
    #port3-1~div.line3-1>.port3-1_wrap>article.port3-1_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3-1:checked~div.line3-1>.port3-1_wrap>article.port3-1_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3-1_label_wrap {
        width: 100%;
        padding-bottom: 30px;
        background: #cadee6;
        position: relative;
        z-index: 1;
    }

    .port3-1_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port3-1_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port3-1_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port3-1_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port3-1_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port3-1_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }


    .port3-1_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -30px;
    }

    .port3-1_con_wrap>.view {
        background: #cadee6;
    }

    .port3-1_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port3-1_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port3-1_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }


    /* port3-2 */
    #port3-1:checked~.line3-2 section {
        margin-top: 56%;
        transition-duration: 0.4s;
    }

    #port3-2~div.line3-2>.port3-2_wrap>article.port3-2_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port3-2:checked~div.line3-2>.port3-2_wrap>article.port3-2_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port3-2_label_wrap {
        width: 100%;
        padding-bottom: 30px;
        background: #fef3f4;
        position: relative;
        z-index: 1;
    }

    .port3-2_label_wrap>div {
        width: 100%;
        margin: 0 auto;
    }

    .port3-2_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
    }

    .port3-2_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
    }

    .port3-2_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
    }

    .port3-2_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port3-2_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 20px;
    }


    .port3-2_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -30px;
    }

    .port3-2_con_wrap>.view {
        background: #fef3f4;
    }

    .port3-2_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port3-2_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port3-2_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line4 :타임,수원시의사회,나인 ***/
    .line4 {
        width: 100%;
        margin: 0 auto;
        background: #fef3f4;
    }

    .line4 .view {
        background: #fef3f4;
    }

    .line4>div {
        width: 100%;
        overflow: hidden;
        margin-left: 1%;
    }

    .line4>div>section {
        width: 32%;
        float: left;
        margin-top: 40px;
        padding-bottom: 2%;
    }

    .line4_label_wrap {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        padding-bottom: 54px;
    }

    .line4_label_wrap label>img {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    /* port4 :타임 */
    #port3-2:checked~.line4 section {
        margin-top: 100%;
        transition-duration: 0.4s;
    }

    #port4~div.line4 .port4_wrap article.port4_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port4:checked~div.line4 .port4_wrap article.port4_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port4_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port4_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -46%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port4_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port4_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port5 :수원시의사회 */
    #port5~div.line4 .port5_wrap article.port5_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port5:checked~div.line4 .port5_wrap article.port5_con_wrap {
        height: 10%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port5_wrap {
        margin: 0 1%;
    }

    .port5_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port5_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -50px;
        background: #3a3a3a;
        z-index: 1;
    }

    .port5_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port5_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port6 :나인 */

    #port6~div.line4 .port6_wrap article.port6_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port6:checked~div.line4 .port6_wrap article.port6_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port6_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port6_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: 18%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port6_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port6_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line5 :아이조아,바라본,아이두 ***/
    .line5 {
        width: 100%;
        margin: 0 auto;
        background: #d5ece6;
    }

    .line5 .view {
        background: #d5ece6;
    }

    .line5>div {
        width: 100%;
        overflow: hidden;
        margin-left: 1%;
    }

    .line5>div>section {
        width: 32%;
        float: left;
        margin-top: 10px;
        padding-bottom: 1.5%;
    }

    .line5_label_wrap {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        padding-bottom: 54px;
    }

    .line5_label_wrap label>img {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    /* port7 :아이조아 */
    #port4:checked~.line5 section {
        margin-top: 72%;
        transition-duration: 0.4s;
    }

    #port5:checked~.line5 section {
        margin-top: 47%;
        transition-duration: 0.4s;
    }

    #port6:checked~.line5 section {
        margin-top: 61%;
        transition-duration: 0.4s;
    }

    #port7~div.line5 .port7_wrap article.port7_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port7:checked~div.line5 .port7_wrap article.port7_con_wrap {
        height: 10%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port7_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port7_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -46%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port7_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port7_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port8 :바라본 */
    #port8~div.line5 .port8_wrap article.port8_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port8:checked~div.line5 .port8_wrap article.port8_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port8_wrap {
        margin: 0 1%;
    }

    .port8_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port8_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -50px;
        background: #3a3a3a;
        z-index: 1;
    }

    .port8_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port8_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port9 :아이두 */
    #port9~div.line5 .port9_wrap article.port9_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port9:checked~div.line5 .port9_wrap article.port9_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port9_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port9_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: 18%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port9_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port9_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line6 :청담엔비,밝은얼굴,압구정역jyp ***/
    .line6 {
        width: 100%;
        margin: 0 auto;
        background: #d6cfec;
    }

    .line6 .view {
        background: #d6cfec;
    }

    .line6>div {
        width: 100%;
        overflow: hidden;
        margin-left: 1%;
    }

    .line6>div>section {
        width: 32%;
        float: left;
        margin-top: 10px;
        padding-bottom: 1.5%;
    }

    .line6_label_wrap {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        padding-bottom: 54px;
    }

    .line6_label_wrap label>img {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    /* port10 :청담엔비 */
    #port7:checked~.line6 section {
        margin-top: 53%;
        transition-duration: 0.4s;
    }

    #port8:checked~.line6 section {
        margin-top: 76%;
        transition-duration: 0.4s;
    }

    #port9:checked~.line6 section {
        margin-top: 68%;
        transition-duration: 0.4s;
    }

    #port10~div.line6 .port10_wrap article.port10_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port10:checked~div.line6 .port10_wrap article.port10_con_wrap {
        height: 10%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port10_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port10_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -46%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port10_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port10_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port11 :밝은얼굴 */
    #port11~div.line6 .port11_wrap article.port11_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port11:checked~div.line6 .port11_wrap article.port11_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port11_wrap {
        margin: 0 1%;
    }

    .port11_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port11_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -50px;
        background: #3a3a3a;
        z-index: 1;
    }

    .port11_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port11_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port12 :압구정역jyp */
    #port12~div.line6 .port12_wrap article.port12_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port12:checked~div.line6 .port12_wrap article.port12_con_wrap {
        height: 10%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port12_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port12_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: 18%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port12_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port12_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line7 :강남미,미래지안,달란트 ***/
    .line7 {
        width: 100%;
        margin: 0 auto;
        background: #fef3f4;
    }

    .line7 .view {
        background: #fef3f4;
    }

    .line7>div {
        width: 100%;
        overflow: hidden;
        margin-left: 1%;
    }

    .line7>div>section {
        width: 32%;
        float: left;
        padding-bottom: 1%;
    }

    .line7_label_wrap {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
    }

    .line7_label_wrap label>img {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    /* port13 :강남미 */
    #port10:checked~.line7 section {
        margin-top: 42%;
        transition-duration: 0.4s;
    }

    #port11:checked~.line7 section {
        margin-top: 50%;
        transition-duration: 0.4s;
    }

    #port12:checked~.line7 section {
        margin-top: 34%;
        transition-duration: 0.4s;
    }

    #port13~div.line7 .port13_wrap article.port13_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port13:checked~div.line7 .port13_wrap article.port13_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port13_wrap>.line7_label_wrap {
        margin-top: 16px;
        padding-bottom: 54px;
    }

    .port13_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port13_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -46%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port13_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port13_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port14 :미래지안 */
    #port14~div.line7 .port14_wrap article.port14_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port14:checked~div.line7 .port14_wrap article.port14_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port14_wrap {
        margin: 0 1%;
    }

    .port14_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
    }

    .port14_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -50px;
        background: #3a3a3a;
        z-index: 1;
    }

    .port14_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port14_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port15 :달란트 */
    #port15~div.line7 .port15_wrap article.port15_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port15:checked~div.line7 .port15_wrap article.port15_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port15_wrap>.line7_label_wrap {
        padding-bottom: 50px;
    }

    .port15_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port15_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: 18%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port15_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port15_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line8 :오렌지,강남k뷰티,에스원 ***/
    .line8 {
        width: 100%;
        margin: 0 auto;
        background: #d5ece6;
    }

    .line8 .view {
        background: #d5ece6;
    }

    .line8>div {
        width: 100%;
        overflow: hidden;
        margin-left: 1%;
    }

    .line8>div>section {
        width: 32%;
        float: left;
        margin-top: 10px;
        padding-bottom: 1.5%;
    }

    .line8_label_wrap {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        padding-bottom: 54px;
    }

    .line8_label_wrap label>img {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    /* port16 :오렌지 */
    #port13:checked~.line8 section {
        margin-top: 58%;
        transition-duration: 0.4s;
    }

    #port14:checked~.line8 section {
        margin-top: 87%;
        transition-duration: 0.4s;
    }

    #port15:checked~.line8 section {
        margin-top: 62%;
        transition-duration: 0.4s;
    }

    #port16~div.line8 .port16_wrap article.port16_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port16:checked~div.line8 .port16_wrap article.port16_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port16_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port16_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -46%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port16_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port16_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port17 :강남k뷰티 */
    #port17~div.line8 .port17_wrap article.port17_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port17:checked~div.line8 .port17_wrap article.port17_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port17_wrap {
        margin: 0 1%;
    }

    .port17_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port17_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: -50px;
        background: #3a3a3a;
        z-index: 1;
    }

    .port17_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port17_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /* port18 :에스원 */
    #port18~div.line8 .port18_wrap article.port18_con_wrap {
        width: 100%;
        height: 0px;
        position: relative;
        left: 0;
        right: 0;
    }

    #port18:checked~div.line8 .port18_wrap article.port18_con_wrap {
        height: 15%;

        position: absolute;
        transition-duration: 0.5s;
    }

    .port18_wrap>.line8_label_wrap {
        padding-bottom: 60px;
    }

    .port18_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port18_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        margin-left: 18%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port18_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
    }

    .port18_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    /*** line_last ***/
    #port16:checked~.line_last section {
        margin-top: 52%;
        transition-duration: 0.4s;
    }

    #port17:checked~.line_last section {
        margin-top: 50%;
        transition-duration: 0.4s;
    }

    #port18:checked~.line_last section {
        margin-top: 45%;
        transition-duration: 0.4s;
    }

    .line_last {
        background: #d5ece6;
    }

}

/* //mobile포폴끝 */



/* 20200624 포트폴리오 new **************************************/
/* #port_thecare:checked ~ .line0_narr section{margin-top:1360px; transition-duration:0.5s;} */
/* 더케어클리닉 */
#port_thecare~div.line0_thecare>.port_thecare_wrap>article.port_thecare_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_thecare:checked~div.line0_thecare>.port_thecare_wrap>article.port_thecare_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_thecare_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_thecare_con_wrap>.view {
    margin-left: 56%;
}

.port_thecare_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_thecare_label_wrap {
    width: 100%;
    height: 806px;
    background: #fef3f4;
}

.port_thecare_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_thecare_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_thecare_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_thecare_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_thecare_label_wrap>div>label img {
    display: block;
}

.port_thecare_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_thecare_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_thecare_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_thecare_con>img:last-child {
    margin-right: 0;
}


/* 나를클리닉 */
#port_narr~div.line0_narr>.port_narr_wrap>article.port_narr_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_narr:checked~div.line0_narr>.port_narr_wrap>article.port_narr_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_narr_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_narr_con_wrap>.view {
    margin-left: 56%;
}

.port_narr_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_narr_label_wrap {
    width: 100%;
    height: 806px;
    background: #d5ece6;
}

.port_narr_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_narr_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_narr_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_narr_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_narr_label_wrap>div>label img {
    display: block;
}

.port_narr_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_narr_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_narr_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_narr_con>img:last-child {
    margin-right: 0;
}


/* 엠스타월드 */
#port_mstar~div.line0_mstar>.port_mstar_wrap>article.port_mstar_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_mstar:checked~div.line0_mstar>.port_mstar_wrap>article.port_mstar_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_mstar_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_mstar_con_wrap>.view {
    margin-left: 56%;
}

.port_mstar_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_mstar_label_wrap {
    width: 100%;
    height: 806px;
    background: #d6cfec;
}

.port_mstar_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_mstar_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_mstar_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_mstar_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_mstar_label_wrap>div>label img {
    display: block;
}

.port_mstar_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_mstar_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_mstar_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_mstar_con>img:last-child {
    margin-right: 0;
}



/* 연세흉부 */
#port_kmys~div.line0_kmys>.port_kmys_wrap>article.port_kmys_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_kmys:checked~div.line0_kmys>.port_kmys_wrap>article.port_kmys_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_kmys_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_kmys_con_wrap>.view {
    margin-left: 56%;
}

.port_kmys_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_kmys_label_wrap {
    width: 100%;
    height: 806px;
    background: #fef3f4;
}

.port_kmys_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_kmys_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_kmys_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_kmys_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_kmys_label_wrap>div>label img {
    display: block;
}

.port_kmys_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_kmys_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_kmys_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_kmys_con>img:last-child {
    margin-right: 0;
}

/* 애슬리 */
#port_athley~div.line0_athley>.port_athley_wrap>article.port_athley_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_athley:checked~div.line0_athley>.port_athley_wrap>article.port_athley_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_athley_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_athley_con_wrap>.view {
    margin-left: 56%;
}

.port_athley_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_athley_label_wrap {
    width: 100%;
    height: 806px;
    background: #d5ece6;
}

.port_athley_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_athley_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_athley_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_athley_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_athley_label_wrap>div>label img {
    display: block;
}

.port_athley_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_athley_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_athley_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_athley_con>img:last-child {
    margin-right: 0;
}


/* 스택하우스 */
#port_stack~div.line0_stack>.port_stack_wrap>article.port_stack_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_stack:checked~div.line0_stack>.port_stack_wrap>article.port_stack_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_stack_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_stack_con_wrap>.view {
    margin-left: 56%;
}

.port_stack_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_stack_label_wrap {
    width: 100%;
    height: 806px;
    background: #d6cfec;
}

.port_stack_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_stack_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_stack_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_stack_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_stack_label_wrap>div>label img {
    display: block;
}

.port_stack_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_stack_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_stack_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_stack_con>img:last-child {
    margin-right: 0;
}


/* 고운미소 */
#port_miso~div.line0_miso>.port_miso_wrap>article.port_miso_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_miso:checked~div.line0_miso>.port_miso_wrap>article.port_miso_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_miso_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_miso_con_wrap>.view {
    margin-left: 56%;
}

.port_miso_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_miso_label_wrap {
    width: 100%;
    height: 806px;
    background: #fef3f4;
}

.port_miso_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_miso_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_miso_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_miso_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_miso_label_wrap>div>label img {
    display: block;
}

.port_miso_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_miso_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_miso_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_miso_con>img:last-child {
    margin-right: 0;
}

/* 광명새움 */
#port_saeum~div.line0_saeum>.port_saeum_wrap>article.port_saeum_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_saeum:checked~div.line0_saeum>.port_saeum_wrap>article.port_saeum_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_saeum_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_saeum_con_wrap>.view {
    margin-left: 56%;
}

.port_saeum_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_saeum_label_wrap {
    width: 100%;
    height: 806px;
    background: #d5ece6;
}

.port_saeum_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_saeum_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_saeum_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_saeum_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_saeum_label_wrap>div>label img {
    display: block;
}

.port_saeum_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_saeum_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_saeum_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_saeum_con>img:last-child {
    margin-right: 0;
}



/* 더샤인 */
#port_theshine~div.line0_theshine>.port_theshine_wrap>article.port_theshine_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_theshine:checked~div.line0_theshine>.port_theshine_wrap>article.port_theshine_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_theshine_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_theshine_con_wrap>.view {
    margin-left: 56%;
}

.port_theshine_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_theshine_label_wrap {
    width: 100%;
    height: 806px;
    background: #d6cfec;
}

.port_theshine_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_theshine_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_theshine_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_theshine_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_theshine_label_wrap>div>label img {
    display: block;
}

.port_theshine_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_theshine_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_theshine_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_theshine_con>img:last-child {
    margin-right: 0;
}

/* 라르떼 */
#port_larte~div.line0_larte>.port_larte_wrap>article.port_larte_con_wrap {
    width: 100%;
    height: 0px;
    position: relative;
    left: 0;
    right: 0;
}

#port_larte:checked~div.line0_larte>.port_larte_wrap>article.port_larte_con_wrap {
    height: 900px;
    /*** 이미지높이+margin(60)+화살표높이(50) ***/

    /*position:absolute;*/
    transition-duration: 0.5s;
}

.port_larte_con_wrap {
    width: 100%;
    margin: 0 auto;
    overflow-y: hidden;
    margin-top: -50px;
}

.port_larte_con_wrap>.view {
    margin-left: 56%;
}

.port_larte_con_wrap>.view>img {
    background: #3a3a3a;
}

.port_larte_label_wrap {
    width: 100%;
    height: 806px;
    background: #fef3f4;
}

.port_larte_label_wrap>div {
    width: 1280px;
    margin: 0 auto;
}

.port_larte_label_wrap>div>label {
    display: inline-block;
    margin-top: 100px;
}

.port_larte_label_wrap>div>label:nth-of-type(1) {
    width: 320px;
    height: 456px;
}

.port_larte_label_wrap>div>label:nth-of-type(2) {
    width: 866px;
    cursor: pointer;
    margin-left: 80px;
}

.port_larte_label_wrap>div>label img {
    display: block;
}

.port_larte_label_wrap>div>label:nth-of-type(1)>img {
    margin-top: -180px;
}

.port_larte_con {
    width: 100%;
    background: #3a3a3a;
    height: 900px;
    margin: 0 auto;
    text-align: center;
}

.port_larte_con>img {
    display: inline-block;
    width: 441px;
    margin: 0 auto;
    margin-top: 30px;
    margin-right: 20px;
}

.port_larte_con>img:last-child {
    margin-right: 0;
}



/******* mobile *******/
@media screen and (max-width:960px) {

    /*** 더케어 ***/
    #port_thecare~div.line0_thecare>.port_thecare_wrap>article.port_thecare_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_thecare:checked~div.line0_thecare>.port_thecare_wrap>article.port_thecare_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_thecare_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_thecare_con_wrap>.view {
        background: #fef3f4;
    }

    .port_thecare_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_thecare_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
        height: auto;
    }

    .port_thecare_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_thecare_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_thecare_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_thecare_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_thecare_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_thecare_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_thecare_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_thecare_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_thecare_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }


    /*** 나를 ***/
    #port_narr~div.line0_narr>.port_narr_wrap>article.port_narr_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_narr:checked~div.line0_narr>.port_narr_wrap>article.port_narr_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_narr_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_narr_con_wrap>.view {
        background: #d5ece6;
    }

    .port_narr_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_narr_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d5ece6;
        position: relative;
        height: auto;
    }

    .port_narr_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_narr_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_narr_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_narr_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_narr_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_narr_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_narr_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_narr_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_narr_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }



    /*** 엠스타월드 ***/
    #port_mstar~div.line0_mstar>.port_mstar_wrap>article.port_mstar_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_mstar:checked~div.line0_mstar>.port_mstar_wrap>article.port_mstar_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_mstar_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_mstar_con_wrap>.view {
        background: #d6cfec;
    }

    .port_mstar_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_mstar_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d6cfec;
        position: relative;
        height: auto;
    }

    .port_mstar_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_mstar_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_mstar_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_mstar_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_mstar_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_mstar_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_mstar_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_mstar_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_mstar_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }

    /*** 연세흉부 ***/
    #port_kmys~div.line0_kmys>.port_kmys_wrap>article.port_kmys_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_kmys:checked~div.line0_kmys>.port_kmys_wrap>article.port_kmys_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_kmys_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_kmys_con_wrap>.view {
        background: #fef3f4;
    }

    .port_kmys_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_kmys_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
        height: auto;
    }

    .port_kmys_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_kmys_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_kmys_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_kmys_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_kmys_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_kmys_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_kmys_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_kmys_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_kmys_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }


    /*** 애슬리 ***/
    #port_athley~div.line0_athley>.port_athley_wrap>article.port_athley_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_athley:checked~div.line0_athley>.port_athley_wrap>article.port_athley_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_athley_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_athley_con_wrap>.view {
        background: #d5ece6;
    }

    .port_athley_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_athley_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d5ece6;
        position: relative;
        height: auto;
    }

    .port_athley_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_athley_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_athley_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_athley_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_athley_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_athley_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_athley_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_athley_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_athley_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }

    /*** 스택하우스 ***/
    #port_stack~div.line0_stack>.port_stack_wrap>article.port_stack_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_stack:checked~div.line0_stack>.port_stack_wrap>article.port_stack_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_stack_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_stack_con_wrap>.view {
        background: #d6cfec;
    }

    .port_stack_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_stack_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d6cfec;
        position: relative;
        height: auto;
    }

    .port_stack_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_stack_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_stack_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_stack_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_stack_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_stack_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_stack_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_stack_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_stack_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }



    /*** 고운미소 ***/
    #port_miso~div.line0_miso>.port_miso_wrap>article.port_miso_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_miso:checked~div.line0_miso>.port_miso_wrap>article.port_miso_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_miso_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_miso_con_wrap>.view {
        background: #fef3f4;
    }

    .port_miso_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_miso_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
        height: auto;
    }

    .port_miso_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_miso_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_miso_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_miso_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_miso_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_miso_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_miso_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_miso_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_miso_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }



    /*** 광명새움 ***/
    #port_saeum~div.line0_saeum>.port_saeum_wrap>article.port_saeum_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_saeum:checked~div.line0_saeum>.port_saeum_wrap>article.port_saeum_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_saeum_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_saeum_con_wrap>.view {
        background: #d5ece6;
    }

    .port_saeum_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_saeum_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d5ece6;
        position: relative;
        height: auto;
    }

    .port_saeum_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_saeum_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_saeum_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_saeum_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_saeum_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_saeum_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_saeum_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_saeum_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_saeum_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }



    /*** 더샤인 ***/
    #port_theshine~div.line0_theshine>.port_theshine_wrap>article.port_theshine_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_theshine:checked~div.line0_theshine>.port_theshine_wrap>article.port_theshine_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_theshine_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_theshine_con_wrap>.view {
        background: #d6cfec;
    }

    .port_theshine_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_theshine_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #d6cfec4;
        position: relative;
        height: auto;
    }

    .port_theshine_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_theshine_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_theshine_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_theshine_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_theshine_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_theshine_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_theshine_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_theshine_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_theshine_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }



    /*** 라르떼 ***/
    #port_larte~div.line0_larte>.port_larte_wrap>article.port_larte_con_wrap {
        width: 100%;
        height: 0px;
        /* 	position:absolute;
		left:0; right:0; */
    }

    #port_larte:checked~div.line0_larte>.port_larte_wrap>article.port_larte_con_wrap {
        height: 18%;
        transition-duration: 0.5s;
        overflow: hidden;
    }

    .port_larte_con_wrap {
        width: 100%;
        margin: 0 auto;
        overflow-y: hidden;
        margin-top: -50px;
    }

    .port_larte_con_wrap>.view {
        background: #fef3f4;
    }

    .port_larte_con_wrap>.view>img {
        position: absolute;
        left: 50%;
        background: #3a3a3a;
        z-index: 1;
    }

    .port_larte_label_wrap {
        width: 100%;
        padding-bottom: 50px;
        background: #fef3f4;
        position: relative;
        height: auto;
    }

    .port_larte_label_wrap>div {
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .port_larte_label_wrap>div>label {
        display: inline-block;
        margin-left: 4%;
        margin-top: 0;
    }

    .port_larte_label_wrap>div>label:nth-of-type(1) {
        width: 28%;
        height: auto;
    }

    .port_larte_label_wrap>div>label:nth-of-type(2) {
        width: 62%;
        cursor: pointer;
        margin-left: 0;
    }

    .port_larte_label_wrap>div>label>img {
        display: block;
        width: 100%;
    }

    .port_larte_label_wrap>div>label:nth-of-type(2)>img {
        margin-top: 50px;
    }

    .port_larte_con {
        width: 100%;
        padding: 3% 0;
        background: #3a3a3a;
        margin: 0 auto;
        text-align: center;
        height: auto
    }

    .port_larte_con>img {
        display: inline-block;
        width: 48%;
        margin: 0 auto;
    }

    .port_larte_label_wrap>div>label:nth-of-type(1)>img {
        margin-top: 0
    }
}


/* //20200624 포트폴리오 new **************************************/
















/************ 포트폴리오-모바일 ************/
.portfolio_m {
    width: 100%;
    margin: 0 auto;
    background: #fff;
}

.portfolio_m_b {
    background: #cadee5;
}

.portfolio_m_pi {
    background: #fdf3f4;
}

.portfolio_m_g {
    background: #d6ede7;
}

.portfolio_m_pu {
    background: #d5cfeb;
}

/******* pc *******/
@media screen and (min-width:961px) {
    .portfolio_m>div {
        width: 100%;
        margin: 0 auto;
    }

    .portfolio_m>div>section {
        width: 1228px;
        padding: 120px 0;
        margin: 0 auto;
        overflow: hidden;
    }

    .portfolio_m>div>section>article {
        float: left;
    }


    .port_m_title {
        margin: 30px 60px 0 0;
    }

}

/******* mobile *******/
@media screen and (max-width:960px) {
    .portfolio_m>div {
        width: 100%;
        margin: 0 auto;
    }

    .portfolio_m>div>section {
        width: 96%;
        padding: 7% 0;
        margin: 0 auto;
        overflow: hidden;
    }

    .portfolio_m>div>section>article {
        float: left;
        width: 50%;
        margin: 0 auto;
    }

    .portfolio_m>div>section>article h2 {
        display: block;
        width: 80%;
        margin: 36% 0 0 10%;
    }

    .portfolio_m>div>section>article img {
        display: block;
        width: 100%;
    }
}