@font-face {
    font-family: 'mulgun';
    src: url(../fonts/HML.ttf);
}

*:not(i) {
    font-family: mulgun !important;
}

.btn-collapse {
    display: none;
    float: right;
    margin-top: 6px;
}

.text-align-right {
    text-align: right;
}

.small-menu {
    float: right;
    display: none;
    /* position: absolute;
	right: 0;
	top: 0; */
}

@media screen and (max-width: 915px) {
    .btn-collapse {
        display: block;
    }
    .normal-btns,
    .top-center {
        display: none !important;
    }
}

@media screen and (min-width: 915px) {
    .small-menu {
        display: none !important;
    }
}

#wrap {
    background-size: 100%;
}

.sub01 {
    background: url(/img/pfo_visual01.jpg) no-repeat center top;
}

.sub02 {
    background: url(/img/pfo_visual02.jpg) no-repeat center top;
}

.sub03 {
    background: url(/img/pfo_visual03.jpg) no-repeat center top;
}

.sub04 {
    background: url(/img/pfo_visual04.jpg) no-repeat center top;
}

.sub05 {
    background: url(/img/pfo_visual05.jpg) no-repeat center top;
}

.sub06 {
    background: url(/img/pfo_visual06.jpg) no-repeat center top;
}

.sub07 {
    background: url(/img/pfo_visual07.jpg) no-repeat center top;
}

.sub08 {
    background: url(/img/pfo_visual08.jpg) no-repeat center top;
}

.sub09 {
    background: url(/img/pfo_visual09.jpg) no-repeat center top;
}

.sub10 {
    background: url(/img/pfo_visual10.jpg) no-repeat center top;
}

.sub11 {
    background: url(/img/pfo_visual11.jpg) no-repeat center top;
}

.sub12 {
    background: url(/img/pfo_visual12.jpg) no-repeat center top;
}

.sub13 {
    background: url(/img/pfo_visual13.jpg) no-repeat center top;
}

.sub14 {
    background: url(/img/pfo_visual14.jpg) no-repeat center top;
}

.sub15 {
    background: url(/img/pfo_visual15.jpg) no-repeat center top;
}

.sub16 {
    background: url(/img/pfo_visual16.jpg) no-repeat center top;
}

.sub17 {
    background: url(/img/pfo_visual17.jpg) no-repeat center top;
}

.sub18 {
    background: url(/img/pfo_visual18.jpg) no-repeat center top;
}

.sub19 {
    background: url(/img/pfo_visual19.jpg) no-repeat center top;
}

.sub20 {
    background: url(/img/pfo_visual20.jpg) no-repeat center top;
}

.sub21 {
    background: url(/img/pfo_visual21.jpg) no-repeat center top;
}

.sub22 {
    background: url(/img/pfo_visual22.jpg) no-repeat center top;
}

.pfo_visual {
    padding-top: 110px;
    text-align: center;
}

.pfo_visual .top_logo {
    margin: 3.599% 0 2.799%;
}

.pfo_visual .top_txt {
    display: inline-block;
    margin-bottom: 6%;
}

.pfo_visual .top_txt h4 {
    /*font-size:130px;*/
    font-size: 5.078125vw;
    color: #fff;
    font-weight: 300;
    line-height: 1;
    padding-bottom: 1%;
    border-bottom: 2px solid #fff;
}

.pfo_visual .top_txt h4 strong {
    font-weight: 400;
}

.pfo_visual .top_txt p {
    /*font-size:24px;*/
    font-size: 0.9375vw;
    color: #fff;
    font-weight: 500;
    padding-top: 1%;
}

.pfo_visual .top_img {
    /* background-color: #1d212a; */
}

.pfo_visual .top_img_in {
    position: relative;
    width: 100%;
    max-width: 1770px;
    margin: 0 auto;
}

.pfo_visual .top_img_in>img {
    width: 100%;
    height: auto;
}

.pfo_visual .top_img_in .inner {
    position: absolute;
    left: 0;
    top: 25px;
    width: 100%;
    height: 100%;
}

.pfo_visual .top_img_in .inner img {
    display: block;
    position: absolute;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
}


/* .pfo_visual .top_img_in .inner img.pc_part { left:0; top:0; max-width:100%; }
.pfo_visual .top_img_in .inner img.mo_part { right:0; top:27%; width: 38%; max-width:38% !important;  } */

.pfo_visual .top_txt h4.type02 {
    padding-left: 80px;
    padding-right: 80px;
}

.pfo_visual .top_txt h4.type02 span {
    font-size: 6.378125vw;
    font-weight: 200;
}

.sub22 .pfo_visual .top_txt h4.type02 {
    padding: 0;
    padding-bottom: 1.4vw;
}

.sub22 .pfo_visual .top_txt h4.type02 span {
    font-weight: 100;
}

.sub22 .pfo_visual .top_txt h4.type02 strong {
    font-size: 2.3vw;
    letter-spacing: 0.075em
}

.sub22 .pfo_visual .top_txt h4.type02 strong b {
    font-weight: 400;
    font-size: 2.9vw
}

.pfo_visual .top_img_in .inner img.upside {
    transform: translate(0, -1100px);
    -webkit-transform: translate(0, -1100px);
    -moz-transform: translate(0, -1100px);
    -o-transform: translate(0, -1100px);
    opacity: 0;
}

.pfo_visual .top_img_in .inner img.leftside {
    transform: translate(-1100px, 0);
    -webkit-transform: translate(-1100px, 0);
    -moz-transform: translate(-1100px, 0);
    -o-transform: translate(-1100px, 0);
    opacity: 0;
}

.pfo_visual .top_img_in .inner img.rightside {
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0);
    -moz-transform: translate(1000px, 0);
    -o-transform: translate(1000px, 0);
    opacity: 0;
}

.pfo_visual .top_img_in .inner img.on {
    transform: translate(0, 0);
    opacity: 1;
}

.pfo_visual .top_txt2 h5 {
    /*font-size:38px;*/
    font-size: 1.484375vw;
    color: #000;
    font-weight: 500;
}

.pfo_visual .top_txt2 p {
    /*font-size:32px;*/
    font-size: 1.25vw;
    color: #666;
}

.pfo_visual.type02 .top_txt {
    margin-bottom: 0;
}

.pfo_visual.type03 .top_txt {
    margin-bottom: 200px;
}

.pfo_visual.type04 {
    padding-bottom: 37%;
}

.pfo_visual.type05 {
    padding-top: 0;
}

.foot_common .container01 {
    margin-bottom: 100px;
}

.pfo_con {
    margin-bottom: 80px;
}

.pb {
    padding-top: 60px;
}

.pfo_con .inner_img {
    text-align: center;
}

.pfo_con .inner_img>img {
    width: 100%;
}

.pfo_con .inner_img p {
    /*font-size:30px;*/
    font-size: 1.171875vw;
    color: #000;
    padding: 60px 0;
    background: #fafafa;
}

.pfo_con .inner_img p.col01 {
    color: #947a50;
}

.pfo_con .inner_img .half {
    overflow: hidden;
}

.pfo_con .inner_img .half img {
    display: block;
    float: left;
    width: 50%;
}

.pfo_con .sig_type01,
.pfo_con .sig_type02 {
    width: 75%;
    margin: 0 auto;
}

.pfo_con .sig_type01.mb70 {
    margin-bottom: 78px;
}

.pfo_con .sig_type01 ul {
    overflow: hidden;
}

.pfo_con .sig_type01 ul li {
    float: left;
    width: 47.8688%;
}

.pfo_con .sig_type01 ul li:first-child {
    margin-right: 4.2622%;
}

.pfo_con .sig_type01 ul li img {
    width: 100%;
}

.pfo_con .sig_type02 ul {
    overflow: hidden;
}

.pfo_con .sig_type02 ul li {
    float: left;
    width: 31.4754%;
    margin-right: 2.786%;
}

.pfo_con .sig_type02 ul li:nth-of-type(3n) {
    margin-right: 0;
}

.pfo_con .sig_type02 ul li img {
    width: 100%;
}

.pfo_con .color_type {
    width: 75%;
    margin: 0 auto;
    padding: 5% 0;
}

.pfo_con .sub09_color ul {
    overflow: hidden;
}

.pfo_con .sub09_color ul li {
    float: left;
    width: 29.8360%;
    margin: 0 5.2459% 1.2% 0;
    color: #fff;
    font-size: 1.015625vw;
    padding: 1.5% 3%;
    box-sizing: border-box;
}

.pfo_con .sub09_color ul li:nth-of-type(3n) {
    margin-right: 0;
}

.pfo_con .sub09_color ul li:first-child {
    background: #002d60;
}

.pfo_con .sub09_color ul li:nth-of-type(2) {
    background: #004989;
}

.pfo_con .sub09_color ul li:nth-of-type(3) {
    background: #4a9963;
}

.pfo_con .sub09_color ul li:nth-of-type(4) {
    background: #808285;
}

.pfo_con .sub09_color ul li:nth-of-type(5) {
    background: #d1d3d4;
}

.pfo_con .sub11_color ul {
    overflow: hidden;
}

.pfo_con .sub11_color ul li {
    float: left;
    width: 43.715%;
}

.pfo_con .sub11_color ul li p {
    font-size: 1.25vw;
}

.pfo_con .sub11_color ul li>div {
    height: 5.2vw;
    margin-top: 3%;
    color: #fff;
    font-size: 1.054vw;
    padding: 3%;
    box-sizing: border-box;
    background: #fa7497;
}

.pfo_con .sub11_color ul li:first-child {
    margin-right: 12.5683%;
}

.pfo_con .sub11_color ul li:nth-of-type(2)>div {
    background: #404041;
    padding-top: 5.2%;
}

.pfo_con .sub12_color ul {
    overflow: hidden;
}

.pfo_con .sub12_color ul li {
    float: left;
    width: 20.6967%;
    margin: 0 5.737% 0 0;
    text-align: center;
    color: #fff;
    font-size: 1.015vw;
    padding: 8.2% 0;
    box-sizing: border-box;
}

.pfo_con .sub12_color ul li:nth-of-type(4n) {
    margin-right: 0;
}

.pfo_con .sub12_color ul li:first-child {
    background: url('/img/pfo_img12_2_01.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub12_color ul li:nth-of-type(2) {
    background: url('/img/pfo_img12_2_02.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub12_color ul li:nth-of-type(3) {
    background: url('/img/pfo_img12_2_03.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub12_color ul li:nth-of-type(4) {
    background: url('/img/pfo_img12_2_04.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub19_color {
    width: 100%;
    min-height: 886px;
    padding: 0 0;
    background: url('/img/pfo_img19_2_bg.jpg') no-repeat center center / cover;
}

.pfo_con .sub19_color ul {
    overflow: hidden;
    margin-top: 0;
    margin-bottom: 0;
    padding: 267px 0;
    font-size: 0;
    text-align: center;
}

.pfo_con .sub19_color ul li {
    display: inline-block;
    vertical-align: top;
    width: 353px;
    height: 353px;
    margin: 0 -7px;
    text-align: center;
    color: #555555;
    font-size: 26px;
    box-sizing: border-box;
    font-weight: 300;
}

.pfo_con .sub19_color ul li b {
    color: #222222;
    font-weight: bold;
}

.pfo_con .sub19_color ul li.type02 {
    position: relative;
    z-index: 1;
    color: #fff;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.pfo_con .sub19_color ul li.type02 b {
    color: #fff;
}

.pfo_con .sub19_color ul li>div {
    display: table;
    width: 100%;
    height: 100%;
}

.pfo_con .sub19_color ul li>div p {
    display: table-cell;
    vertical-align: middle;
}

.pfo_con .sub19_color ul li:nth-of-type(3n) {
    margin-right: 0;
}

.pfo_con .sub19_color ul li:first-child {
    background: url('/img/pfo_img19_2_s1.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub19_color ul li:nth-of-type(2) {
    background: url('/img/pfo_img19_2_s2.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub19_color ul li:nth-of-type(3) {
    background: url('/img/pfo_img19_2_s1.png') no-repeat center top;
    background-size: 100% 100%;
}

.pfo_con .sub19_color ul li.upside {
    transform: translate(0, 1000px);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.pfo_con .sub19_color ul li.under {
    transform: translate(0, -1000px);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.pfo_con .sub19_color ul li.on {
    transform: translate(0, 0);
}

.pfo_con .pfo_img20_3 {
    margin-top: -2px;
}

.pfo_con .pfo_img20_5 {
    margin-top: -2px;
}

.pfo_con .pfo_img21_3 {
    margin-top: -2px;
}

@media all and (min-width:3000px) {
    .pfo_con .sub19_color ul li {
        width: 600px;
        height: 600px;
        font-size: 45px;
    }
}

@media all and (max-width:1450px) {
    .pfo_con .sub19_color {
        min-height: 61.103vw;
    }
    .pfo_con .sub19_color ul {
        padding: 18.4vw 0;
    }
    .pfo_con .sub19_color ul li {
        width: 24.345vw;
        height: 24.345vw;
        margin: 0 -0.483vw;
        font-size: 1.793vw;
    }
}

@media all and (max-width:999px) {
    .pfo_con .sub19_color ul {
        padding: 15.6vw 0;
    }
    .pfo_con .sub19_color ul li {
        width: 30.030vw;
        height: 30.030vw;
        margin: 0 -0.501vw;
        font-size: 2.603vw;
    }
}


/* sub_container */

.sub_container ul li.textPart dl {
    margin-top: 4.747%;
    color: #666;
    /*font-size:26px;*/
    font-size: 1.015625vw;
}

.sub_container ul li.textPart dl a {
    font-size: 1.015625vw;
    color: #666;
}

.sub_container ul li.textPart dl:after {
    content: "";
    clear: both;
    display: block;
}

.sub_container ul li.textPart dl dt {
    float: left;
    display: block;
    width: 15.789%;
    margin-bottom: 1%;
    color: #999;
}

.sub_container ul li.textPart dl dd {
    float: left;
    display: block;
    width: 84.211%;
    margin-bottom: 1%;
}

.sub_container ul li.textPart dl dt:last-of-type {
    margin-bottom: 0;
}

.sub_container ul li.textPart dl dd:last-of-type {
    margin-bottom: 0;
}

.sub_container ul li.textPart dl dd a {
    margin-right: 2.5%;
}

.sub_container ul li.textPart dl dd a.nohand {
    cursor: text;
}

.sub_container ul li.textPart dl dd a:nth-of-type(1) img {
    width: 13.812%;
}

.sub_container ul li.textPart dl dd a:nth-of-type(2) img {
    width: 19.66%;
}

.sub_container ul li.textPart dl dd a:nth-of-type(3) img {
    width: 17.918%;
    margin-right: 0;
}


/* about */

.about_con01,
.about_con02,
.about_con03,
.about_con04,
.about_con05,
.about_con06 {
    margin-bottom: 120px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.organization_bi {
    padding: 0.02px;
    background-color: #1a1a1a;
    background-image: url(/img/organization_bg.png);
    background-repeat: no-repeat;
    background-position: center top;
}

.organization_bi .inner {
    margin: 4.798% 3%;
}

.organization_bi .con01 {
    position: relative;
    max-width: 1500px;
    height: 1100px;
    margin: 0 auto;
}

.organization_bi .con01 .circle {
    position: absolute;
    display: block;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    text-align: center;
}

.organization_bi .con01 .circle p {
    font-size: 30px;
    color: #fff;
    line-height: 1.2;
}

.organization_bi .con01 .f_size p {
    font-size: 25px;
}

.organization_bi .con01 .circle p span {
    display: block;
    font-size: 26px;
}

.organization_bi .con01 .dep01 {
    width: 250px;
    height: 250px;
    background: #e41957 url(/img/organization_icon01.png) no-repeat center 30%;
}

.organization_bi .con01 .dep01 p {
    margin-top: 150px;
    font-size: 44px;
}

.organization_bi .con01 .dep02 {
    opacity: 0;
    opacity: 1 \0/IE8+9;
    background: #302f30 url(/img/organization_icon02.png) no-repeat center 30%;
}

.organization_bi .con01.on .dep02 {
    -webkit-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.organization_bi .con01 .dep02 p {
    margin-top: 130px;
}

.organization_bi .con01 .dep03 {
    opacity: 0;
    opacity: 1 \0/IE8+9;
    background: #262626 url(/img/organization_icon03.png) no-repeat center 25%;
}

.organization_bi .con01.on .dep03 {
    -webkit-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.organization_bi .con01 .dep03 p {
    margin-top: 120px;
}

.organization_bi .con01 .pos01 {
    top: 190px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.organization_bi .con01 .pos02 {
    top: 0;
    left: 320px;
}

.organization_bi .con01 .pos03 {
    top: 375px;
    left: 320px;
}

.organization_bi .con01 .pos04 {
    top: 0;
    right: 320px;
}

.organization_bi .con01 .pos05 {
    top: 375px;
    right: 320px;
}

.organization_bi .con01 .pos06 {
    top: 185px;
    left: 0;
}

.organization_bi .con01 .pos07 {
    top: 620px;
    left: 90px;
}

.organization_bi .con01 .pos08 {
    top: 830px;
    left: 390px;
}

.organization_bi .con01 .pos09 {
    top: 830px;
    right: 390px;
}

.organization_bi .con01 .pos10 {
    top: 620px;
    right: 90px;
}

.organization_bi .con01 .pos11 {
    top: 185px;
    right: 0;
}

.organization_bi .con01 .pos06 p {
    margin-top: 110px;
}

.organization_bi .con02 {
    margin-top: 4.423%;
}

.organization_bi .con02 ul {
    max-width: 2100px;
    margin: 0 auto;
    text-align: center;
}

.organization_bi .con02 ul:after {
    content: "";
    clear: both;
    display: block;
}

.organization_bi .con02 ul li {
    height: 560px;
    opacity: 0;
    opacity: 1 \0/IE8+9;
    float: left;
    width: calc(48.572% - 2px);
    margin-right: 2.857%;
    margin-bottom: 2.857%;
    padding: 4.762%;
    box-sizing: border-box;
    border: 1px solid #606060;
}

.organization_bi .con02.on ul li {
    -webkit-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.organization_bi .con02.on ul li:nth-of-type(n+3) {
    -webkit-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.organization_bi .con02.on ul li:nth-of-type(n+5) {
    -webkit-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.organization_bi .con02 ul li:nth-of-type(2n) {
    margin-right: 0;
}

.organization_bi .con02 ul li h5 {
    /*font-size:50px;*/
    font-size: 1.953125vw;
    color: #fff;
}

.organization_bi .con02 ul li span {
    display: block;
    margin: 1.226% 0;
    /*font-size:30px;*/
    font-size: 1.171875vw;
    color: #e41957;
}

.organization_bi .con02 ul li p {
    /*font-size:28px;*/
    font-size: 1.09375vw;
    color: #999;
    word-break: keep-all;
}

.organization_bi .con02 ul li p span.vih {
    display: inline;
    visibility: hidden;
    font-size: 1.09375vw;
}

.clients_bi {
    padding: 0.02px;
    background: #f5f5f5;
}

.clients_bi ul {
    margin: 4% 6.3973% 2%;
}

.clients_bi ul:after {
    content: "";
    clear: both;
    display: block;
}

.clients_bi ul li {
    float: left;
    width: 17.606%;
    margin-right: 2.99%;
    margin-bottom: 2.99%;
    box-shadow: 24px 0 27px rgba(0, 0, 0, 0.29);
}

.clients_bi ul li:nth-of-type(5n) {
    margin-right: 0;
}

.clients_bi ul li img {
    width: 100%;
    display: block;
}

.recruit_bi {
    position: relative;
    margin-bottom: 120px;
}

.recruit_bi ul {
    overflow: hidden;
}

.recruit_bi ul:after {
    content: "";
    clear: both;
    display: block;
}

.recruit_bi ul li {
    position: relative;
    float: left;
    width: 25%;
    text-align: center;
    overflow: hidden;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li img {
    display: block;
    width: 100%;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-transform: scale(1.01);
    -moz-transform: scale(1.01);
    -o-transform: scale(1.01);
    -ms-transform: scale(1.01);
    transform: scale(1.01);
    transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li .txt {
    position: absolute;
    top: 41.5%;
    left: 0;
    width: 100%;
}

.recruit_bi ul li .txt i {
    /*font-size:80px;*/
    font-size: 3.125vw;
    color: #fff;
    font-weight: 100;
    font-style: normal;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li .txt h5 {
    /*font-size:38px;*/
    font-size: 1.484375vw;
    color: #e41957;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li .txt span {
    display: block;
    margin: 1.226% 0;
    /*font-size:30px;*/
    font-size: 1.171875vw;
    color: #fff;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li .txt p {
    /*font-size:28px;*/
    font-size: 1.09375vw;
    color: #999;
    word-break: keep-all;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi a.link {
    position: absolute;
    bottom: 7.78%;
    left: 50%;
    display: block;
    margin: 1.8% auto 0;
    padding: 1.2% 0;
    width: 10.368852459%;
    text-align: center;
    color: #fff;
    font-size: 1.09375vw;
    background: #e41957;
    border: 1px solid #090909;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.recruit_bi a.link i {
    margin: 1.5% 0 0 10%;
    color: #fff;
    font-size: 1.3671875vw;
}

.recruit_bi ul li.on img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-
}

.recruit_bi ul li .txt {
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.recruit_bi ul li.on .txt i {
    font-size: 3.3vw;
}

.recruit_bi ul li.on .txt h5 {
    font-size: 1.6vw;
}

.recruit_bi ul li.on .txt span {
    font-size: 1.3vw;
}

.recruit_bi ul li.on .txt p {
    font-size: 1.2vw;
}

.recf_wrap {
    margin-bottom: 120px;
}

.rec_form .tit {
    padding: 0 0 0 3.5%;
    background: #e41957;
    color: #fff;
    text-align: left;
    overflow: hidden;
}

.rec_form .tit span {
    display: inline-block;
    float: left;
    padding: 1% 0;
    font-size: 1.953vw;
}

.rec_form .detail_type {
    background: #fff;
}

.rec_form .detail_type table {
    width: 100%;
}

.rec_form .detail_type table tr {
    border-bottom: 1px solid #bfbfbf;
}

.rec_form .detail_type table th {
    padding: 0 2%;
    font-size: 1.328125vw;
    color: #222;
    font-weight: 300;
    text-align: left;
    border-bottom: 1px solid #bfbfbf;
}

.rec_form .detail_type table .col02 {
    color: #e41957;
}

.rec_form .detail_type table td {
    padding: 25px 2%;
    font-size: 1.328125vw;
    color: #222;
    vertical-align: middle;
    border-bottom: 1px solid #bfbfbf;
}

.rec_form .detail_type table td input {
    width: 40%;
    height: 50px;
    border: 1px solid #adacac;
    font-size: 1.1vw;
    padding: 0 10px;
    box-sizing: border-box;
}

.rec_form .detail_type table td input.bcolo02 {
    border: 1px solid #e41957;
}

.rec_form .detail_type table td span {
    display: inline-block;
    width: 13%;
    box-sizing: border-box;
    font-size: 1.328125vw;
    color: #222;
}

.rec_form .detail_type table td p {
    display: inline-block;
    width: 38%;
    box-sizing: border-box;
}

.rec_form .detail_type table td p>input.size02 {
    width: 35%;
    margin-left: 1%;
}

.rec_form .detail_type table td p>span.size02 {
    display: inline-block;
    padding-left: 4%;
    box-sizing: border-box;
    width: 34%;
}

.rec_form .detail_type table td input.size03 {
    width: 40%;
}

.rec_form .detail_type table td input[type="file"] {
    width: 100%;
    background: #fff;
    padding: 2px 10px;
}

.rec_form .detail_type table td label {
    font-size: 1.328125vw;
    color: #222;
    vertical-align: middle;
    margin-right: 3%;
}

.rec_form .detail_type table td label input {
    display: none;
}

.rec_form .detail_type table td label input+i {
    display: inline-block;
    width: 1.640625vw;
    height: 1.640625vw;
    margin-right: 5px;
    background: url('/img/check_style.png') no-repeat left top;
    vertical-align: middle;
    background-size: 100%;
}

.rec_form .detail_type table td label input:checked+i {
    background: url('/img/checked_style.png') no-repeat left top;
    background-size: 100%;
}

.rec_form .detail_type table td textarea {
    resize: none;
    width: 100%;
    height: 290px;
    border: 1px solid #adacac;
    box-sizing: border-box;
    padding: 10px;
}

.rec_form .detail_type .agree {
    margin-top: 30px;
    padding: 0 2%;
    font-size: 1.25vw;
    color: #444;
    font-weight: 300;
    vertical-align: middle;
}

.rec_form .detail_type .agree input {
    width: 1.171875vw;
    height: 1.171875vw;
    vertical-align: middle;
}

.rec_form .detail_type .agree label {
    display: inline-block;
    vertical-align: middle;
    margin-top: 0.3%;
}

.rec_form .detail_type .agree a {
    display: inline-block;
    float: right;
    width: 12.1192%;
    text-align: center;
    background: #8b8e97;
    color: #fff;
    font-size: 1.25vw;
    line-height: 1;
    padding: 1.3% 0;
    vertical-align: middle;
}

.rec_form>a {
    display: block;
    margin: 1.8% auto 0;
    padding: 1.2% 0;
    width: 16%;
    text-align: center;
    color: #fff;
    font-size: 1.6796875vw;
    background: #e41957;
    font-weight: 300;
}

.rec_form .rec_end {
    margin-bottom: 3.5%;
    padding: 12% 0;
    text-align: center;
    font-size: 2.734375vw;
    font-weight: 300;
    color: #222;
    border-bottom: 1px solid #a7a7a7;
}

.rec_form .rec_end span {
    color: #e41957;
    font-weight: 400;
}

.location_bi {
    position: relative;
    height: 100%;
    background: #f5f5f5;
}

.location_bi .txt_wrap {
    position: absolute;
    top: 0;
    right: 0;
    width: 28.9%;
    height: 100%;
}

.location_bi .txt_wrap .inner {
    display: table;
    width: 100%;
    height: 100%;
}

.location_bi .txt_wrap .con_dtc {
    display: table-cell;
    vertical-align: middle;
    padding-left: 5.541%;
    background: #f5f5f5;
}

.location_bi .txt_wrap dl {
    margin-bottom: 5%;
}

.location_bi .txt_wrap dl dt {
    /*font-size:25px;*/
    font-size: 1.25vw;
    color: #000;
    margin-bottom: 1.5%;
}

.location_bi .txt_wrap dl dd {
    /*font-size:23px;*/
    font-size: 1.09375vw;
    color: #333;
    font-weight: 300;
}

.location_bi .txt_wrap dl dd.num {
    /*font-size:23px;*/
    margin-top: 2%;
    padding-bottom: 2%;
}

.location_bi .txt_wrap dl dd.num a {
    font-size: 1.09375vw;
    color: #333;
    cursor: default;
}

.location_bi .txt_wrap .btn {
    font-size: 0;
}

.location_bi .txt_wrap .btn a {
    display: inline-block;
    width: 29.326%;
    padding: 2.053% 0;
    /*font-size:25px;*/
    font-size: 0.9765625vw;
    color: #fff;
    text-align: center;
    margin-right: 5px;
}

.location_bi .txt_wrap .btn a:nth-of-type(1) {
    background: #e41957;
}

.location_bi .txt_wrap .btn a:nth-of-type(2) {
    background: #2e2e2e;
}

.notice_bi {
    position: relative;
}

.notice_bi ul:after {
    content: "";
    clear: both;
    display: block;
}

.notice_bi ul li {
    float: left;
    width: calc(25% - 7px);
    height: 19.53125vw;
    margin-right: 7px;
    margin-bottom: 7px;
    padding: 4% 2%;
    box-sizing: border-box;
    background: #fafafa;
}

.notice_bi ul li:nth-of-type(4n) {
    margin-right: 0;
}

.notice_bi ul li span {
    /*font-size:35px;*/
    font-size: 1.3671875vw;
    color: #e41957;
}

.notice_bi ul li h5 {
    /*font-size:40px;*/
    font-size: 1.5625vw;
    color: #222;
    margin: 4% 0 6%;
}

.notice_bi ul li p {
    /*font-size:30px;*/
    font-size: 1.171875vw;
    color: #222;
}

.notice_read .read_wrap .tit {
    border-top: 1px solid #333;
    border-bottom: 1px solid #bfbfbf;
    background: #fafafa;
    overflow: hidden;
    padding: 1.5% 50px 1.5% 60px;
}

.notice_read .read_wrap .tit h6 {
    float: left;
    width: 87%;
    font-size: 1.953125vw;
    color: #222;
    letter-spacing: -0.05em;
}

.notice_read .read_wrap .tit p {
    float: right;
    width: 13%;
    text-align: right;
    margin-top: 0.5%;
    color: #e41957;
    font-size: 1.3671875vw;
}

.notice_read .read_wrap .detail {
    padding: 60px 60px 180px;
    font-size: 1.5625vw;
    letter-spacing: -0.05em;
    color: #444;
    border-bottom: 1px solid #222;
}

.notice_read .btn_type {
    text-align: right;
    font-size: 0;
    margin-top: 34px;
}

.notice_read .btn_type a {
    display: inline-block;
    width: 8.984375%;
    margin-left: 10px;
    font-size: 1.328125vw;
    color: #fff;
    background: #8b8e97;
    text-align: center;
    line-height: 1;
    padding: 0.765% 0;
}

.notice_read a.enter {
    display: block;
    margin: 0 auto 120px;
    width: 15.859375%;
    background: #e41957;
    color: #fff;
    font-size: 1.6796875vw;
    line-height: 1;
    padding: 1.5% 0;
    text-align: center;
}


/* 20170919 */

.inner_box {
    position: relative;
    overflow: hidden;
}

.inner_box>img {
    width: 100%;
    height: auto;
}

.inner_box_in {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.inner_box_in img {
    position: absolute;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
}

.inner_box_in img.sldn {
    position: absolute;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -o-transition: all 0.8s;
    -ms-transition: all 0.7s;
    transition: all 0.7s;
}


/* .inner img.sldn { position:absolute; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } */

.pfo_visual .top_img_in .inner img.sldn {
    position: absolute;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -o-transition: all 0.7s;
    -ms-transition: all 0.7s;
    transition: all 0.7s;
}

.inner_box_in img.lefttopside {
    transform: translate(-1100px, -1100px);
    -webkit-transform: translate(-1100px, -1100px);
    -moz-transform: translate(-1100px, -1100px);
    -o-transform: translate(-1100px, -1100px);
    opacity: 0;
}

.inner_box_in img.leftdownside {
    transform: translate(-1100px, 1100px);
    -webkit-transform: translate(-1100px, 1100px);
    -moz-transform: translate(-1100px, 1100px);
    -o-transform: translate(-1100px, 1100px);
    opacity: 0;
}

.inner_box_in img.righttopside {
    transform: translate(1100px, -1100px);
    -webkit-transform: translate(1100px, -1100px);
    -moz-transform: translate(1100px, -1100px);
    -o-transform: translate(1100px, -1100px);
    opacity: 0;
}

.inner_box_in img.rightdownside {
    transform: translate(1100px, 1100px);
    -webkit-transform: translate(1100px, 1100px);
    -moz-transform: translate(1100px, 1100px);
    -o-transform: translate(1100px, 1100px);
    opacity: 0;
}

.inner_box_in img.scalein {
    transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
}

.inner_box_in img.leftside {
    transform: translate(-1100px, 0);
    -webkit-transform: translate(-1100px, 0);
    -moz-transform: translate(-1100px, 0);
    -o-transform: translate(-1100px, 0);
    opacity: 0;
}

.inner_box_in img.rightside {
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0);
    -moz-transform: translate(1000px, 0);
    -o-transform: translate(1000px, 0);
    opacity: 0;
}

.inner_box_in img.upside {
    transform: translate(0, -1100px);
    -webkit-transform: translate(0, -1100px);
    -moz-transform: translate(0, -1100px);
    -o-transform: translate(0, -1100px);
    opacity: 0;
}

.inner_box_in img.under {
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px);
    -moz-transform: translate(0, 1000px);
    -o-transform: translate(0, 1000px);
    opacity: 0;
}

.inner_box_in img.on {
    transform: translate(0, 0);
    opacity: 1;
    transform: scale(1, 1);
}


/*   portfolio/sub01.jsp  ~~~~~    */


/**/

img.pfo_img01_s1 {
    left: 10%;
    top: 0;
    width: 80%;
}

img.pfo_img01_s2 {
    right: 11%;
    top: 27%;
    width: 24%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img01_s2 {
        right: 8%;
        width: 30%;
    }
}

img.pfo_img01_1_s1 {
    left: 10%;
    top: 18%;
    width: 44%;
    z-index: 3;
    transform: scale(1, 1) rotateZ(34deg) !important;
}

img.pfo_img01_1_s2 {
    right: 10%;
    top: 18%;
    transition-delay: 0.2s;
    width: 44%;
    z-index: 6;
    transform: scale(1, 1) rotate(34deg) !important;
}

img.pfo_img01_1_s3 {
    right: 0;
    bottom: 0;
    transition-delay: 0.4s;
    width: 61%;
    z-index: 1;
}


/* @media all and (max-width:550px) {
	img.pfo_img01_1_s1 { left:0; top:0; width: 100%;  z-index:3; }
	img.pfo_img01_1_s2 { right:0; top:41%; transition-delay:0.2s; width: 100%; z-index:2; }
	img.pfo_img01_1_s3 { right:0; bottom:0; transition-delay:0.4s; width: 100%; z-index:1; }
} */

img.pfo_img01_2_s1 {
    left: 4%;
    top: 4%;
    width: 72%;
}

img.pfo_img01_2_s2 {
    right: 2%;
    bottom: 4%;
    width: 52%;
    transition-delay: 0.2s;
}

.infinite1 {
    width: 43%;
    left: 4%;
    top: 9%;
}

.infinite2 {
    width: 65%;
    right: -2%;
    bottom: 7%;
}

.mark1 {
    width: 43%;
    left: 2%;
    top: 9%;
}

.mark2 {
    width: 35%;
    left: 22%;
    bottom: 7%;
}

.mark3 {
    width: 24%;
    right: 23%;
    top: 4%;
}

.mark4 {
    width: 24%;
    right: 2%;
    bottom: 5%;
}

img.pfo_img01_3_s1 {
    left: 5%;
    top: 21%;
    width: 34%;
}

img.pfo_img01_3_s2 {
    left: 45%;
    top: 41%;
    width: 11%;
    transition-delay: 0.2s;
}

img.pfo_img01_3_s3 {
    right: 5%;
    top: 25%;
    width: 34%;
    transition-delay: 0.4s;
}


/* @media all and (max-width:550px) {
	img.pfo_img01_3_s1 { left:-20%; top:0; width: 81%; }
	img.pfo_img01_3_s2 { left:-30%; bottom:24%; width: 124%; max-width:none !important; }
	img.pfo_img01_3_s3 { right:15%; bottom:-14%;  width: 76%; }
} */

img.pfo_img02_s1 {
    left: 0;
    top: 0;
    width: 100%;
}

img.pfo_img02_s2 {
    left: 0;
    bottom: 0;
    width: 24%;
    transition-delay: 0.6s !important;
}

img.pfo_img02_s3 {
    right: 0;
    top: 0;
    width: 34%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img02_s2 {
        left: 0;
        bottom: 0;
        width: 24%;
    }
    img.pfo_img02_s3 {
        right: 0;
        top: 0;
        width: 34%;
    }
}

.pfo_img02_1 {
    text-align: center;
    max-width: 2400px;
    margin: 0 auto;
}

img.pfo_img02_1_s1 {
    right: 0;
    top: 0;
    width: 82%;
    z-index: 3;
}

img.pfo_img02_1_s2 {
    right: 0;
    bottom: 0;
    width: 91%;
    z-index: 2;
    transition-delay: 0.2s;
}

img.pfo_img02_1_s3 {
    right: 0;
    bottom: 0;
    width: 47%;
    z-index: 1;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img02_1_s1 {
        right: -8%;
        top: 5%;
        width: 100%;
    }
    img.pfo_img02_1_s2 {
        right: -14%;
        bottom: 25%;
        width: 113%;
        max-width: none !important;
    }
    img.pfo_img02_1_s3 {
        right: 0;
        bottom: 0;
        width: 93%;
    }
}

.pfo_img02_2 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img02_2_s1 {
    left: 0;
    top: 0;
    width: 72%;
}

img.pfo_img02_2_s2 {
    right: 0;
    bottom: 0;
    width: 30%;
    transition-delay: 0.2s;
}

@media all and (max-width:550px) {
    img.pfo_img02_2_s1 {
        left: 0;
        top: 7%;
        width: 94%;
    }
    img.pfo_img02_2_s2 {
        right: 0;
        bottom: -2%;
        width: 38%;
    }
}

.pfo_img02_3 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img02_3_s1 {
    left: 0;
    bottom: 0;
    z-index: 2;
    width: 73.3%;
}

img.pfo_img02_3_s2 {
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 48.5%;
    transition-delay: 0.2s;
}

@media all and (max-width:550px) {
    img.pfo_img02_3_s1 {
        left: 0;
        bottom: 46%;
        width: 100%;
    }
    img.pfo_img02_3_s2 {
        right: 2%;
        bottom: -8%;
        width: 82%;
    }
}

img.pfo_img03_s1 {
    left: 0;
    top: 0;
    width: 100%;
}

img.pfo_img03_s2 {
    right: 0;
    bottom: 0;
    width: 37%;
    transition-delay: 0.2s !important;
}

.pfo_img03_1 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img03_1_s1 {
    left: 0;
    top: 0;
    z-index: 2;
    width: 61%;
    transition-delay: 0.2s;
}

img.pfo_img03_1_s2 {
    right: 0;
    top: 0;
    z-index: 1;
    width: 61%;
}

.pfo_img03_2 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img03_2_s1 {
    left: 0;
    top: 0;
    z-index: 1;
}

img.pfo_img03_2_s2 {
    left: 0;
    top: 0;
    z-index: 2;
    transition-delay: 0.2s;
    width: 62%;
}

img.pfo_img03_2_s3 {
    right: 0;
    top: 0;
    z-index: 2;
    transition-delay: 0.4s;
    width: 82.7%;
}

img.pfo_img03_2_s4 {
    right: 0;
    top: 0;
    z-index: 2;
    transition-delay: 0.6s;
    width: 58.7%;
}

@media all and (max-width:550px) {
    img.pfo_img03_2_s1 {
        display: none;
    }
    img.pfo_img03_2_s2 {
        left: -1.2%;
        top: -2.8%;
        width: 100%;
    }
    img.pfo_img03_2_s3 {
        right: -27%;
        top: 12%;
        width: 133%;
        max-width: none !important;
    }
    img.pfo_img03_2_s4 {
        right: 0;
        top: 24%;
        width: 100%;
    }
}

.pfo_img03_3 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img03_3_s1 {
    left: 0;
    top: 0;
    width: 56.6%;
}

img.pfo_img03_3_s2 {
    right: 0;
    top: 0;
    width: 56.4%;
    transition-delay: 0.2s;
}

@media all and (max-width:550px) {
    img.pfo_img03_3_s1 {
        left: 0;
        top: 0;
        width: 81%;
    }
    img.pfo_img03_3_s2 {
        right: 0;
        top: 30%;
        width: 82%;
    }
}

img.pfo_img04 {
    left: 0;
    top: 0;
}

.pfo_img04_1 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img04_1_s1 {
    left: 0;
    top: 0;
    width: 61%;
}

img.pfo_img04_1_s2 {
    right: 26.3%;
    top: 34%;
    width: 6%;
    transition-delay: 0.2s;
}

img.pfo_img04_1_s3 {
    right: 19.7%;
    top: 34%;
    width: 6%;
    transition-delay: 0.4s;
}

img.pfo_img04_1_s4 {
    right: 13.1%;
    top: 34%;
    width: 6%;
    transition-delay: 0.6s;
}

img.pfo_img04_1_s5 {
    right: 6.7%;
    top: 34%;
    width: 6%;
    transition-delay: 0.8s;
}

@media all and (max-width:550px) {
    img.pfo_img04_1_s1 {
        left: 0;
        top: 56%;
        width: 96%;
        transition-delay: 0.9s;
        transition-duration: 0.7s;
    }
    img.pfo_img04_1_s2 {
        right: 69.1%;
        top: 23.7%;
        width: 15%;
    }
    img.pfo_img04_1_s3 {
        right: 52.2%;
        top: 23.7%;
        width: 15%;
    }
    img.pfo_img04_1_s4 {
        right: 34.5%;
        top: 23.7%;
        width: 15%;
    }
    img.pfo_img04_1_s5 {
        right: 17.6%;
        top: 23.7%;
        width: 15%;
    }
}

.pfo_img04_2 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img04_2_s1 {
    left: 0;
    top: 0;
}

img.pfo_img04_2_s2 {
    left: 0;
    top: 0;
    transition-delay: 0.2s;
}

img.pfo_img04_2_s3 {
    left: 0;
    top: 0;
    transition-delay: 0.4s;
}

img.pfo_img04_2_s4 {
    left: 0;
    top: 0;
    transition-delay: 0.6s;
}

@media all and (max-width:550px) {
    img.pfo_img04_2_s1 {
        left: 0%;
        top: 15%;
        width: 100%;
        max-width: none !important;
        transition-duration: 0.7s;
    }
    img.pfo_img04_2_s2 {
        left: 0%;
        top: 15%;
        width: 100%;
        max-width: none !important;
        transition-duration: 0.7s;
    }
    img.pfo_img04_2_s3 {
        left: 0%;
        top: 15%;
        width: 100%;
        max-width: none !important;
        transition-duration: 0.7s;
    }
    img.pfo_img04_2_s4 {
        left: 0%;
        top: 15%;
        width: 100%;
        max-width: none !important;
        transition-duration: 0.7s;
    }
}

.pfo_img04_3 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img04_3_s1 {
    left: 0;
    top: 0;
    width: 53%;
}

img.pfo_img04_3_s2 {
    right: 0;
    bottom: 0;
    width: 52%;
    transition-delay: 0.2s;
}

@media all and (max-width:550px) {
    img.pfo_img04_3_s1 {
        left: 0;
        top: 0;
        width: 88%;
    }
    img.pfo_img04_3_s2 {
        right: 0;
        bottom: 0;
        width: 84%;
    }
}

img.pfo_img05_s1 {
    left: 0;
    top: 0;
}

img.pfo_img05_s2 {
    right: 0;
    bottom: 0;
    width: 42%;
    transition-delay: 0.2s !important;
}

.pfo_img05_1 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img05_1_s1 {
    left: 0;
    top: 0;
}

img.pfo_img05_1_s2 {
    left: 0;
    top: 0;
    width: 73%;
    transition-delay: 0.1s;
}

img.pfo_img05_1_s3 {
    right: 0;
    top: 0;
    width: 40.5%;
    transition-delay: 0.2s;
}

img.pfo_img05_1_s4 {
    left: 0;
    bottom: 0;
    width: 29.2%;
    transition-delay: 0.3s;
}

img.pfo_img05_1_s5 {
    right: 0;
    bottom: 0;
    width: 29%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img05_1_s1 {
        left: -15%;
        top: 0;
        width: 135%;
        max-width: none !important;
    }
    img.pfo_img05_1_s2 {
        left: -15%;
        top: 0;
        width: 98%;
    }
    img.pfo_img05_1_s3 {
        right: -18.3%;
        top: 0;
        width: 52.5%;
    }
    img.pfo_img05_1_s4 {
        left: -15.7%;
        bottom: 1.3%;
        width: 40.2%;
    }
    img.pfo_img05_1_s5 {
        right: -24.6%;
        bottom: 4%;
        width: 44%;
    }
}

.pfo_img05_2 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img05_2_s1 {
    right: 0;
    bottom: 0;
    width: 44%;
    transition-delay: 0.2s;
}

img.pfo_img05_2_s2 {
    left: 0;
    bottom: 0;
    width: 48%;
    transition-delay: 0.4s;
}

img.pfo_img05_2_s3 {
    left: 0;
    top: 0;
    width: 75%;
    transition-delay: 0.6s;
}

@media all and (max-width:550px) {
    img.pfo_img05_2_s1 {
        right: 6%;
        bottom: 0;
        width: 58%;
    }
    img.pfo_img05_2_s2 {
        left: 0;
        bottom: 6%;
        width: 86%;
    }
    img.pfo_img05_2_s3 {
        left: 0;
        top: 0;
        width: 97%;
    }
}

.pfo_img05_3 {
    text-align: center;
    max-width: 2500px;
    margin: 0 auto;
}

img.pfo_img05_3_s1 {
    right: 0;
    top: 0;
    width: 55%;
}

img.pfo_img05_3_s2 {
    right: 0;
    top: 0;
    width: 85%;
    transition-delay: 0.2s;
}

img.pfo_img05_3_s3 {
    left: 0;
    bottom: 0;
    width: 67%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img05_3_s1 {
        right: 0;
        top: 0;
        width: 99%;
    }
    img.pfo_img05_3_s2 {
        right: -30%;
        top: 24%;
        width: 132%;
        max-width: none !important;
    }
    img.pfo_img05_3_s3 {
        left: 0;
        bottom: 0;
        width: 100%;
    }
}

img.pfo_img06_s1 {
    left: 0;
    top: 0;
}

img.pfo_img06_s2 {
    right: 0;
    bottom: 0;
    width: 37%;
}

.pfo_img06_1 {
    text-align: center;
    max-width: 1625px;
    margin: 0 auto;
}

img.pfo_img06_1_s1 {
    right: 0;
    top: 0;
}

img.pfo_img06_1_s2 {
    left: 0;
    bottom: 0;
    transition-delay: 0.5s;
}

.pfo_img06_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img06_2_s1 {
    left: 0;
    top: 0;
}

img.pfo_img06_2_s2 {
    left: 0;
    top: 0;
    transition-delay: 0.2s;
}

img.pfo_img06_2_s3 {
    left: 0;
    bottom: 0;
    width: 68%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img06_2_s1 {
        left: -41%;
        top: 26%;
        width: 186%;
        max-width: none !important;
    }
    img.pfo_img06_2_s2 {
        left: -42%;
        top: 28%;
        width: 186%;
        max-width: none !important;
    }
    img.pfo_img06_2_s3 {
        left: -38%;
        bottom: 0;
        width: 121%;
        max-width: none !important;
    }
}

.pfo_img06_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img06_3_s1 {
    left: 0;
    top: 0;
}

img.pfo_img06_3_s2 {
    left: 0;
    bottom: 0;
    width: 36%;
    transition-delay: 0.2s;
}

img.pfo_img06_3_s3 {
    left: 34%;
    top: 40%;
    width: 10%;
    transition-delay: 0.3s;
}

img.pfo_img06_3_s4 {
    left: 39.6%;
    top: 45.7%;
    width: 10%;
    transition-delay: 0.4s;
}

img.pfo_img06_3_s5 {
    left: 58%;
    top: 52%;
    width: 10%;
    transition-delay: 0.5s;
}

img.pfo_img06_3_s6 {
    left: 64.3%;
    top: 40%;
    width: 10%;
    transition-delay: 0.6s;
}

@media all and (max-width:550px) {
    img.pfo_img06_3_s1 {
        left: -8%;
        top: 0;
        width: 120%;
        max-width: none !important;
    }
    img.pfo_img06_3_s2 {
        left: -5%;
        bottom: 0;
        width: 36%;
    }
    img.pfo_img06_3_s3 {
        left: 33%;
        top: 43%;
    }
    img.pfo_img06_3_s4 {
        left: 39.8%;
        top: 49.7%;
    }
    img.pfo_img06_3_s5 {
        left: 61.8%;
        top: 55.3%;
    }
    img.pfo_img06_3_s6 {
        left: 69.3%;
        top: 43%;
    }
}

img.pfo_img07_s1 {
    left: 0;
    top: 0;
}

img.pfo_img07_s2 {
    right: 0;
    bottom: 0;
    width: 40%;
    transition-delay: 0.2s !important;
}

.pfo_img07_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img07_1_s1 {
    right: 0;
    top: 0;
    width: 71%;
}

img.pfo_img07_1_s2 {
    left: 0;
    top: 0;
    width: 66%;
    transition-delay: 0.2s;
}

img.pfo_img07_1_s3 {
    right: 0;
    bottom: 0;
    width: 71%;
    transition-delay: 0.4s;
}

img.pfo_img07_1_s4 {
    left: 0;
    bottom: 0;
    width: 78%;
    transition-delay: 0.6s;
}

@media all and (max-width:550px) {
    img.pfo_img07_1_s1 {
        right: -18%;
        top: 0;
        width: 106%;
        max-width: none !important;
    }
    img.pfo_img07_1_s2 {
        left: -3%;
        top: 0;
        width: 100%;
    }
    img.pfo_img07_1_s3 {
        right: -4%;
        bottom: -5%;
        width: 96%;
    }
    img.pfo_img07_1_s4 {
        left: -14%;
        bottom: -4%;
        width: 100%;
    }
}

.pfo_img07_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img07_2_s1 {
    right: 0;
    bottom: 0;
    width: 67%;
}

img.pfo_img07_2_s2 {
    left: 0;
    bottom: 0;
    width: 68%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img07_2_s1 {
        right: -22%;
        bottom: 0;
        width: 97%;
    }
    img.pfo_img07_2_s2 {
        left: -17%;
        bottom: 0;
        width: 96%;
    }
}

.fo_img07_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img07_3_s1 {
    left: 0;
    top: 0;
    width: 51%;
}

img.pfo_img07_3_s2 {
    right: 0;
    bottom: 0;
    width: 79%;
    transition-delay: 0.2s;
}

img.pfo_img07_3_s3 {
    left: 0;
    bottom: 0;
    width: 31%;
    transition-delay: 0.3s;
}

@media all and (max-width:550px) {
    img.pfo_img07_3_s1 {
        left: -10%;
        top: 0;
        width: 61%;
    }
    img.pfo_img07_3_s2 {
        right: -3%;
        bottom: 0;
        width: 85%;
    }
    img.pfo_img07_3_s3 {
        left: -9%;
        bottom: 0;
        width: 37%;
    }
}

.pfo_img08_box {
    text-align: center;
    max-width: 430px;
    margin: 0 auto;
}

img.pfo_img08 {
    left: 0;
    top: 0;
}

@media all and (max-width:550px) {
    .pfo_img08_box {
        max-width: 80%;
    }
}

.pfo_img08_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img08_1_s1 {
    left: 0;
    top: 0;
    width: 64.5%;
}

img.pfo_img08_1_s2 {
    right: 0;
    bottom: 0;
    width: 42%;
}

@media all and (max-width:550px) {
    img.pfo_img08_1_s1 {
        left: -40%;
        top: 0;
        width: 139%;
        max-width: none !important;
    }
    img.pfo_img08_1_s2 {
        right: -41%;
        bottom: 0;
        width: 131%;
        max-width: none !important;
    }
}

.pfo_img08_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img08_2_s1 {
    left: 0;
    top: 0;
    width: 62.8%;
    transition-delay: 0.2s;
}

img.pfo_img08_2_s2 {
    left: 0;
    top: 0;
    width: 43.1%;
    transition-delay: 0.4s;
}

img.pfo_img08_2_s3 {
    right: 0;
    top: 0;
    width: 44%;
    transition-delay: 0.6s;
}

img.pfo_img08_2_s4 {
    right: 0;
    top: 0;
    width: 64%;
    transition-delay: 0.8s;
}

img.pfo_img08_2_s5 {
    right: 0;
    top: 0;
    width: 39%;
    transition-delay: 1.0s;
}

@media all and (max-width:550px) {
    img.pfo_img08_2_s1 {
        left: -53%;
        top: -10%;
        width: 171%;
        max-width: none !important;
    }
    img.pfo_img08_2_s2 {
        left: -53%;
        top: -10%;
        width: 117%;
        max-width: none !important;
    }
    img.pfo_img08_2_s3 {
        right: -50%;
        top: 18.4%;
        width: 117%;
        max-width: none !important;
    }
    img.pfo_img08_2_s4 {
        right: -46%;
        top: 20%;
        width: 165%;
        max-width: none !important;
    }
    img.pfo_img08_2_s5 {
        right: -16%;
        top: 35%;
        width: 100%;
        max-width: none !important;
    }
}

.pfo_img08_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img08_3_s1 {
    left: 0;
    top: 0;
    width: 40.7%;
}

img.pfo_img08_3_s2 {
    left: 0;
    top: 0;
    width: 60.4%;
    transition-delay: 0.2s;
}

img.pfo_img08_3_s3 {
    right: 0;
    top: 0;
    width: 40%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img08_3_s1 {
        left: -38.6%;
        top: -11%;
        width: 90%;
    }
    img.pfo_img08_3_s2 {
        left: -36%;
        top: 16%;
        width: 134%;
        max-width: none !important;
    }
    img.pfo_img08_3_s3 {
        right: 3%;
        top: 35%;
        width: 90%;
    }
}

img.pfo_img09 {
    left: 0;
    top: 0;
}

.pfo_img09_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img09_2_s1 {
    right: 0;
    bottom: -14%;
    width: 50%;
}

img.pfo_img09_2_s2 {
    right: 0;
    bottom: 0;
    width: 31%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img09_2_s1 {
        right: 0;
        bottom: 0%;
        width: 100%;
    }
    img.pfo_img09_2_s2 {
        right: 0;
        bottom: 7%;
        width: 64%;
    }
}

.sig_type_com img {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.sig_type_com img.scalein {
    transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
}

.sig_type_com img.on {
    transform: translate(0, 0);
    opacity: 1;
    transform: scale(1, 1);
}

img.pfo_img09_1_01 {}

img.pfo_img09_1_02 {
    transition-delay: 0.2s;
}

img.pfo_img09_1_03 {
    transition-delay: 0.4s;
}

img.pfo_img09_1_04 {
    transition-delay: 0.3s;
}

img.pfo_img09_1_05 {
    transition-delay: 0.5s;
}

.color_type_ani ul li {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.color_type_ani ul li.opazero {
    opacity: 0;
}

.color_type_ani ul li.on {
    opacity: 1;
}

.color_type_ani ul li:nth-of-type(2) {
    transition-delay: 0.2s;
}

.color_type_ani ul li:nth-of-type(3) {
    transition-delay: 0.4s;
}

.color_type_ani ul li:nth-of-type(4) {
    transition-delay: 0.6s;
}

.color_type_ani ul li:nth-of-type(5) {
    transition-delay: 0.8s;
}

img.pfo_img10_2_s1 {
    left: 0;
    top: 0;
    transition-duration: 0.6s;
}

img.pfo_img10_2_s2 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img10_2_s3 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.1s
}

img.pfo_img10_2_s4 {
    left: 0;
    bottom: 0;
    transition-delay: 0.2s;
    transition-duration: 0.6s;
}

img.pfo_img10_5_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img10_5_s2 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.1s;
}

img.pfo_img10_5_s3 {
    left: 0;
    bottom: 0;
    width: 50%;
    transition-delay: 0.2s;
}

img.pfo_img10_5_s4 {
    right: 0;
    bottom: 0;
    width: 50%;
    transition-delay: 0.3s;
}

.pfo_img10_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img10_1_1_s1 {
    right: 0;
    top: 0;
    width: 46%;
}

img.pfo_img10_1_1_s2 {
    right: 0;
    top: 0;
    width: 69%;
    transition-delay: 0.1s;
}

img.pfo_img10_1_1_s3 {
    left: 0;
    bottom: 0;
    width: 64%;
    transition-delay: 0.2s;
}

img.pfo_img10_1_2_s1 {
    right: 0;
    top: 0;
    width: 61%;
}

img.pfo_img10_1_2_s2 {
    left: 0;
    top: 0;
    width: 43%;
}


/**/

.pfo_img11_1_ani {}

.pfo_img11_1_ani img {
    transition: all 0.5s;
}

.pfo_img11_1_ani img.pfo_img11_1 {
    opacity: 0;
    transition-delay: 0.5s;
}

.pfo_img11_1_ani img.on {
    opacity: 1;
}

.sub11_color_ani {}

.sub11_color_ani ul li div {
    transition: all 0.5s;
    opacity: 0;
}

.sub11_color_ani ul li div.on {
    opacity: 1;
}

.sub11_color_ani ul li:nth-of-type(1) div {
    transition-delay: 0.3s;
}

.sub11_color_ani ul li:nth-of-type(2) div {
    transition-delay: 0.5s;
}

.pfo_img11_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img11_3_s1 {
    left: 0;
    top: 0;
    width: 50%;
    width: 66.5%;
}

img.pfo_img11_3_s2 {
    left: 0;
    bottom: 0;
    width: 50%;
    width: 66.5%;
    transition-delay: 0.2s;
}

img.pfo_img11_3_s3 {
    right: 0;
    top: 0;
    width: 50%;
    width: 33.4%;
    transition-delay: 0.4s;
}

img.pfo_img11_3_s4 {
    right: 0;
    bottom: 0;
    width: 50%;
    width: 33.4%;
    transition-delay: 0.6s;
}

img.pfo_img11_3_s5 {
    right: 0;
    bottom: 0;
    width: 50%;
    width: 33.4%;
    transition-delay: 0.8s;
}

.sig_type01_ani ul li img {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.sig_type01_ani ul li img.scalein {
    transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
}

.sig_type01_ani ul li img.on {
    transform: translate(0, 0);
    opacity: 1;
    transform: scale(1, 1);
}

img.pfo_img12_1_02 {
    transition-delay: 0.2s !important;
}

.sub12_color_ani ul li {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.sub12_color_ani ul li.opazero {
    opacity: 0;
}

.sub12_color_ani ul li.on {
    opacity: 1;
}

.sub12_color_ani ul li:nth-of-type(2) {
    transition-delay: 0.2s;
}

.sub12_color_ani ul li:nth-of-type(3) {
    transition-delay: 0.4s;
}

.sub12_color_ani ul li:nth-of-type(4) {
    transition-delay: 0.6s;
}

.pfo_img12_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img12_2_1_s1 {
    right: 0;
    top: 0;
    width: 23.4%;
}

img.pfo_img12_2_1_s2 {
    right: 0;
    top: 0;
    width: 46%;
    transition-delay: 0.2s;
}

img.pfo_img12_2_2_s1 {
    right: 0;
    top: 0;
    width: 37.6%;
}

img.pfo_img12_2_3_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img13_s1 {}

img.pfo_img13_s2 {
    right: 0;
    bottom: 0;
    width: 40%;
    transition-delay: 0.2s !important;
}

img.pfo_img13_1_s1 {
    left: 0;
    top: 0;
    width: 52%;
}

img.pfo_img13_1_s2 {
    right: 0;
    top: 0;
    width: 80%;
    transition-delay: 0.2s;
}

img.pfo_img13_1_s3 {
    left: 0;
    bottom: 0;
    width: 28%;
    transition-delay: 0.4s
}

.pfo_img13_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img13_2_s1 {
    left: 0;
    top: 0;
    width: 56%;
}

img.pfo_img13_2_s2 {
    right: 0;
    top: 0;
    width: 69%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img13_2_s1 {
        left: 0;
        top: 6%;
        width: 81%;
    }
    img.pfo_img13_2_s2 {
        right: 0;
        top: 41%;
        width: 96%;
    }
}

.pfo_img13_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img13_3_1_s1 {
    left: 0;
    top: 0;
}

img.pfo_img13_3_1_s2 {
    left: 0;
    bottom: 0;
    width: 61%;
    z-index: 2;
    transition-delay: 0.2s
}

img.pfo_img13_3_1_s3 {
    right: 0;
    bottom: 0;
    width: 58%;
    z-index: 1;
    transition-delay: 0.4s
}

img.pfo_img13_3_2_s1 {
    left: 0;
    top: 0;
    width: 59%;
    z-index: 2;
    transition-delay: 0.2s
}

img.pfo_img13_3_2_s2 {
    right: 0;
    top: 0;
    width: 54%;
    z-index: 1;
    transition-delay: 0.4s
}

@media all and (max-width:550px) {
    img.pfo_img13_3_1_s1 {
        left: -24%;
        top: 0;
        width: 143%;
        max-width: none !important;
    }
    img.pfo_img13_3_1_s2 {
        left: 0;
        bottom: 33%;
        width: 90%;
    }
    img.pfo_img13_3_1_s3 {
        right: 0;
        bottom: 6%;
        width: 90%;
    }
    img.pfo_img13_3_2_s1 {
        left: 0;
        top: 0;
        width: 90%;
    }
    img.pfo_img13_3_2_s2 {
        right: 0;
        top: 48%;
        width: 90%;
    }
}

.pfo_img13_4 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img13_4_1_s1 {
    left: 0;
    top: 0;
    width: 66%;
    z-index: 2;
}

img.pfo_img13_4_1_s2 {
    right: 0;
    top: 0;
    width: 66%;
    transition-delay: 0.2s;
}

img.pfo_img13_4_2_s1 {
    left: 0;
    top: 0;
    width: 61%;
}

img.pfo_img13_4_2_s2 {
    right: 0;
    bottom: 0;
    width: 62%;
    transition-delay: 0.2s;
}

@media all and (max-width:550px) {
    img.pfo_img13_4_1_s1 {
        left: 0;
        top: 36%;
        width: 100%;
        transition-delay: 0.2s;
    }
    img.pfo_img13_4_1_s2 {
        right: 0;
        top: 0;
        width: 100%;
        transition-delay: 0s;
    }
    img.pfo_img13_4_2_s1 {
        left: 0;
        top: 0;
        width: 92%;
    }
    img.pfo_img13_4_2_s2 {
        right: -7%;
        bottom: 0;
        width: 94%;
    }
}

img.pfo_img14_s1 {}

img.pfo_img14_s2 {
    right: 0;
    bottom: 0;
    width: 42%;
    transition-delay: 0.2s !important;
}

.m_pfo_img14_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img14_1_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img14_1_s2 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img14_1_s1 {
        left: 0;
        top: 50%;
        width: 100%;
        transition-delay: 0.2s !important;
    }
    img.pfo_img14_1_s2 {
        right: 0;
        top: 5%;
        width: 100%;
        transition-delay: 0s !important;
    }
}

.pfo_img14_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img14_2_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img14_2_s2 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img14_2_s1 {
        left: 0;
        top: 5%;
        width: 100%;
    }
    img.pfo_img14_2_s2 {
        right: 0;
        top: 50%;
        width: 100%;
    }
}

.pfo_img14_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img14_3_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img14_3_s2 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img14_3_s1 {
        left: -2%;
        top: 0;
        width: 100%;
    }
    img.pfo_img14_3_s2 {
        right: -2.8%;
        top: 30%;
        width: 100%;
    }
}

img.pfo_img15_s1 {}

img.pfo_img15_s2 {
    right: 0;
    bottom: 0;
    width: 39%;
    transition-delay: 0.2s !important;
}

.pfo_img15_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img15_1_s1 {
    left: 0;
    top: 0;
    width: 39%;
}

img.pfo_img15_1_s2 {
    right: 0;
    top: 0;
    width: 70%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img15_1_s1 {
        left: 14%;
        top: 15%;
        width: 75%;
    }
    img.pfo_img15_1_s2 {
        right: 4%;
        top: 37%;
        width: 100%;
    }
}

.pfo_img15_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img15_2_1_s1 {
    left: 0;
    top: 0;
}

img.pfo_img15_2_1_s2 {
    left: 0;
    bottom: 0;
    width: 70%;
    transition-delay: 0.2s;
}

img.pfo_img15_2_1_s3 {
    right: 0;
    bottom: 0;
    width: 46%;
    transition-delay: 0.4s;
}

img.pfo_img15_2_2_s1 {
    left: 0;
    top: 0;
}

img.pfo_img15_2_2_s2 {
    left: 0;
    bottom: -10%;
    width: 88%;
    transition-delay: 0.2s;
}

img.pfo_img15_2_2_s3 {
    right: 0;
    bottom: -19%;
    width: 72%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img15_2_1_s1 {
        left: -21%;
        top: 0;
        width: 143%;
        max-width: none !important;
    }
    img.pfo_img15_2_1_s2 {
        left: 0;
        bottom: 6%;
        width: 100%;
        transition-delay: 0.4s;
    }
    img.pfo_img15_2_1_s3 {
        right: 11%;
        bottom: 49%;
        width: 78%;
        transition-delay: 0.2s;
    }
    img.pfo_img15_2_2_s1 {
        left: 0;
        top: 0;
        width: 123%;
        max-width: none !important;
    }
    img.pfo_img15_2_2_s2 {
        left: 9%;
        bottom: 21%;
        width: 100%;
    }
    img.pfo_img15_2_2_s3 {
        right: 0;
        bottom: -12%;
        width: 100%;
    }
}

.pfo_img16_box {
    text-align: center;
    max-width: 473px;
    margin: 0 auto;
}

img.pfo_img16 {
    left: 0;
    top: 0;
}

@media all and (max-width:550px) {
    .pfo_img16_box {
        max-width: 80%;
    }
}

.pfo_img16_1 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img16_1_s1 {
    left: 0;
    top: 0;
    width: 31%;
}

img.pfo_img16_1_s2 {
    right: 0;
    top: 0;
    width: 31%;
    transition-delay: 0.2s;
}

img.pfo_img16_1_s3 {
    left: 0;
    top: 0;
    width: 63%;
    z-index: 3;
    transition-delay: 0.4s;
}

img.pfo_img16_1_s4 {
    left: 0;
    top: 0;
    width: 87%;
    z-index: 2;
    transition-delay: 0.6s;
}

img.pfo_img16_1_s5 {
    left: 0;
    bottom: 0;
    width: 65%;
    z-index: 1;
    transition-delay: 0.8s;
}

@media all and (max-width:550px) {
    img.pfo_img16_1_s1 {
        left: -5%;
        top: -22%;
        width: 100%;
    }
    img.pfo_img16_1_s2 {
        right: -7.8%;
        top: -4.3%;
        width: 100%;
    }
    img.pfo_img16_1_s3 {
        left: -37%;
        top: 34%;
        width: 137%;
        z-index: 3;
        transition-delay: 0.4s;
        max-width: none !important;
    }
    img.pfo_img16_1_s4 {
        left: -51%;
        top: 34%;
        width: 179%;
        z-index: 2;
        transition-delay: 0.6s;
        max-width: none !important;
    }
    img.pfo_img16_1_s5 {
        left: -44%;
        bottom: 6%;
        width: 137%;
        z-index: 1;
        transition-delay: 0.8s;
        max-width: none !important;
    }
}

.pfo_img16_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img16_2_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img16_2_s2 {
    right: 0;
    top: 0;
    width: 50%;
    transition-delay: 0.2s;
}

img.pfo_img16_2_s3 {
    left: 0;
    top: 0;
    width: 64%;
    transition-delay: 0.4s;
}

img.pfo_img16_2_s4 {
    right: 0;
    top: 0;
    width: 54%;
    transition-delay: 0.6s;
}

@media all and (max-width:550px) {
    img.pfo_img16_2_s1 {
        left: -23%;
        top: 35%;
        width: 80%;
        transition-delay: 0.6s;
    }
    img.pfo_img16_2_s2 {
        right: -25%;
        top: -16%;
        width: 93%;
        transition-delay: 0.2s;
    }
    img.pfo_img16_2_s3 {
        left: -43%;
        top: 13%;
        width: 124%;
        transition-delay: 0.4s;
        max-width: none !important;
    }
    img.pfo_img16_2_s4 {
        right: -21%;
        top: 35%;
        width: 84%;
        transition-delay: 0.8s;
    }
}

.pfo_img16_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img16_3_s1 {
    left: 0;
    top: 0;
    width: 39%;
}

img.pfo_img16_3_s2 {
    left: 0;
    top: 0;
    width: 62%;
    transition-delay: 0.2s;
}

img.pfo_img16_3_s3 {
    right: 0;
    top: 0;
    width: 41%;
    transition-delay: 0.4s;
}

@media all and (max-width:550px) {
    img.pfo_img16_3_s1 {
        left: -31%;
        top: 0;
        width: 94%;
    }
    img.pfo_img16_3_s2 {
        left: -46%;
        top: 0;
        width: 147%;
        max-width: none !important;
    }
    img.pfo_img16_3_s3 {
        right: 13%;
        top: 43%;
        width: 100%;
    }
}

img.pfo_img17_1_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img17_1_s2 {
    right: 0;
    top: 0;
    width: 75%;
    transition-delay: 0.2s;
}

img.pfo_img17_1_s3 {
    right: 0;
    bottom: 0;
    width: 58.8524590164%;
    transition-delay: 0.4s
}

img.pfo_img17_1_s4 {
    right: 0;
    bottom: 0;
    width: 27.3360655738%;
    transition-delay: 0.6s
}

.pfo_img17_2 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img17_2_s1 {
    left: 0;
    top: 0;
    width: 50.7%;
}

img.pfo_img17_2_s2 {
    right: 0;
    top: 0;
    width: 49.3%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img17_2_s1 {
        left: 0;
        top: 0;
        width: 100%;
    }
    img.pfo_img17_2_s2 {
        right: 0;
        top: auto;
        bottom: 0;
        width: 100%;
    }
}

.pfo_img17_3 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img17_3_s1 {
    left: 0;
    top: 0;
    width: 50%;
}

img.pfo_img17_3_s2 {
    right: 0;
    top: 0;
    width: 49%;
    transition-delay: 0.2s !important;
}

@media all and (max-width:550px) {
    img.pfo_img17_3_s1 {
        left: 0;
        top: 0;
        width: 100%;
    }
    img.pfo_img17_3_s2 {
        right: 0;
        top: 50%;
        width: 100%;
    }
}

.pfo_img17_4 {
    text-align: center;
    max-width: 2440px;
    margin: 0 auto;
}

img.pfo_img17_4_s1 {
    left: 50%;
    top: 0;
    width: 50%;
    margin-left: -25%;
}

img.pfo_img17_4_s2 {
    left: 0;
    bottom: 0;
    width: 62.5%;
    transition-delay: 0.2s !important;
}

img.pfo_img17_4_s2.no02 {
    z-index: 2;
}

img.pfo_img17_4_s3 {
    right: 0;
    bottom: 0;
    width: 62.5%;
    transition-delay: 0.4s !important;
}

@media all and (max-width:1000px) {
    img.pfo_img17_4_s1 {
        width: 80%;
        margin-left: -40%;
        margin-top: -5%;
    }
}

@media all and (max-width:550px) {
    img.pfo_img17_4_s1 {
        left: 0;
        top: 0;
        width: 100%;
        margin: 0;
    }
    img.pfo_img17_4_s2 {
        left: 0;
        top: 24%;
        width: 100%;
    }
    img.pfo_img17_4_s3 {
        right: 0;
        top: auto;
        bottom: 0;
        width: 100%;
    }
}

.sub18 .pfo_visual .top_img_in {
    max-width: 100%;
}

.sub18 .pfo_img18_s1 {
    width: 100%;
}

.sub18 .pfo_img18_s2 {
    position: absolute;
    left: 50%;
    top: 4%;
    width: 45.88%;
    margin-left: -23.5%;
}

img.pfo_img18_1_s1 {
    width: 73.9%;
}

img.pfo_img18_1_s2 {
    width: 60.4%;
    transition-delay: 0.2s !important;
}

img.pfo_img18_1_s3 {
    width: 50%;
    transition-delay: 0.4s !important;
}

img.pfo_img18_2_s1 {
    width: 70.27%;
}

img.pfo_img18_2_s2 {
    width: 49.33%;
    transition-delay: 0.2s !important;
}

img.pfo_img18_3_s1 {
    width: 88.86%;
    z-index: 3;
}

img.pfo_img18_3_s2 {
    width: 63.75%;
    z-index: 2;
    transition-delay: 0.2s !important;
}

.sub19 .top_img_in {
    max-width: 100%;
}

img.pfo_img19_s1 {
    width: 100%;
}

img.pfo_img19_1_s1 {
    width: 100%;
    z-index: 3;
}

img.pfo_img19_1_s2 {
    width: 60.66%;
    transition-delay: 0.2s !important;
    z-index: 5;
}

img.pfo_img19_1_s3 {
    width: 72.85%;
    transition-delay: 0.3s !important;
    z-index: 1;
}

img.pfo_img19_3_s1 {
    width: 60.46%;
}

img.pfo_img19_3_s2 {
    width: 60.46%;
    transition-delay: 0.2s !important;
}

img.pfo_img19_3_s3 {
    width: 60.46%;
    transition-delay: 0.3s !important;
}

img.pfo_img19_3_s4 {
    width: 60.46%;
    transition-delay: 0.4s !important;
}

img.pfo_img19_3_s5 {
    width: 60.46%;
    transition-delay: 0.5s !important;
}

img.pfo_img19_3_s6 {
    width: 60.46%;
    transition-delay: 0.6s !important;
}

.sub20 .top_img_in {
    max-width: 100%;
}

.sub20 .pfo_img20_s1 {
    width: 100%;
}

img.pfo_img20_1_s1 {
    width: 50%;
}

img.pfo_img20_1_s2 {
    width: 50%;
    transition-delay: 0.2s !important;
}

img.pfo_img20_2_s1 {
    width: 57.92%;
    z-index: 3;
}

img.pfo_img20_2_s2 {
    width: 62.38%;
    z-index: 1;
    transition-delay: 0.2s !important;
}

img.pfo_img20_3_s1 {
    width: 100%;
}

img.pfo_img20_3_s2 {
    width: 50%;
    transition-delay: 0.2s !important;
}

img.pfo_img20_3_s3 {
    width: 36.09%;
    transition-delay: 0.3s !important;
}

img.pfo_img20_4_s1 {
    width: 100%;
}

img.pfo_img20_5_s1 {
    width: 52.5%;
    z-index: 7;
}

img.pfo_img20_5_s2 {
    width: 100%;
    z-index: 5;
}

img.pfo_img20_5_s3 {
    width: 46.99%;
    z-index: 3;
    transition-delay: 0.2s !important;
}

img.pfo_img20_5_s4 {
    width: 66.52%;
    z-index: 3;
    transition-delay: 0.3s !important;
}

img.pfo_img20_5_s5 {
    width: 45.31%;
    z-index: 3;
    transition-delay: 0.4s !important;
}

.sub21 .top_img_in {
    max-width: 100%;
}

.sub21 .pfo_img21_s1 {
    width: 100%;
}

img.pfo_img21_1_s1 {
    width: 100%;
    z-index: 1;
}

img.pfo_img21_1_s2 {
    width: 50%;
    z-index: 3;
    transition-delay: 0.2s !important;
}

img.pfo_img21_1_s3 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.2s !important;
}

img.pfo_img21_1_s4 {
    width: 55.7%;
    z-index: 2;
    transition-delay: 0.4s !important;
}

img.pfo_img21_1_s5 {
    width: 47.69%;
    z-index: 2;
    transition-delay: 0.6s !important;
}

img.pfo_img21_2_s1 {
    width: 63.24%;
    z-index: 2;
}

img.pfo_img21_2_s2 {
    width: 60.93%;
    z-index: 3;
    transition-delay: 0.2s !important;
}

img.pfo_img21_2_s3 {
    width: 50%;
    z-index: 1;
    transition-delay: 0.4s !important;
}

img.pfo_img21_3_s1 {
    width: 64.06%;
    z-index: 2;
}

img.pfo_img21_3_s2 {
    width: 42.5%;
    z-index: 2;
    transition-delay: 0.2s !important;
}

img.pfo_img21_3_s3 {
    width: 39.02%;
    z-index: 2;
    transition-delay: 0.3s !important;
}

img.pfo_img21_3_s4 {
    width: 100%;
    z-index: 1;
}

.sub22 .top_img_in {
    max-width: 100%;
}

.sub22 .pfo_img22_s1 {
    width: 100%;
}

img.pfo_img22_1_s1 {
    width: 100%;
    z-index: 1;
}

img.pfo_img22_1_s2 {
    width: 45.4%;
    z-index: 3;
    transition-delay: 0.2s !important;
}

img.pfo_img22_2_s1 {
    width: 100%;
    z-index: 2;
}

img.pfo_img22_2_s2 {
    width: 100%;
    z-index: 3;
    transition-delay: 0.2s !important;
}

.pfo_img22_3_bg {
    background: url('/img/pfo_img22_3_s1.jpg')no-repeat center / cover;
}

ul.pfo_img22_3_ul {
    font-size: 0;
    letter-spacing: -4px;
    text-align: center;
    padding: 11vw 0;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

ul.pfo_img22_3_ul li {
    display: inline-block;
    vertical-align: top;
    width: 25%;
}

ul.pfo_img22_3_ul li img {
    position: static;
    width: 7.8515625vw;
}

ul.pfo_img22_3_ul li span {
    display: block;
    font-size: 1.015625vw;
    color: #fff;
    letter-spacing: -0.025em;
    font-weight: bold;
    line-height: 1.40625vw;
    margin-top: 0.78125vw;
}

ul.pfo_img22_3_ul li:nth-of-type(2) {
    transition-delay: 0.2s !important;
}

ul.pfo_img22_3_ul li:nth-of-type(3) {
    transition-delay: 0.3s !important;
}

ul.pfo_img22_3_ul li:nth-of-type(4) {
    transition-delay: 0.4s !important;
}

ul li.upside {
    transform: translate(0, -1100px);
    -webkit-transform: translate(0, -1100px);
    -moz-transform: translate(0, -1100px);
    -o-transform: translate(0, -1100px);
    opacity: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
}

ul li.upside.on {
    transform: translate(0, 0);
    opacity: 1;
}

img.pfo_img22_4_s1 {
    width: 100%;
    z-index: 2;
}

img.pfo_img22_4_s2 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.2s !important;
}

img.pfo_img22_4_s3 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.3s !important;
}

img.pfo_img22_4_s4 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.2s !important;
}

img.pfo_img22_4_s5 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.3s !important;
}

img.pfo_img22_4_s6 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.4s !important;
}

img.pfo_img22_4_s7 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.5s !important;
}

img.pfo_img22_4_s8 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.6s !important;
}

@media all and (max-width:1400px) {
    ul.pfo_img22_3_ul {
        padding: 10vw 0
    }
    ul.pfo_img22_3_ul li {
        width: 50%;
        margin: 20px 0;
    }
    ul.pfo_img22_3_ul li img {
        width: 201px;
    }
    ul.pfo_img22_3_ul li span {
        font-size: 18px;
        margin: 10px 0;
        line-height: 1.4
    }
}

@media all and (max-width:1000px) {
    ul.pfo_img22_3_ul {
        max-width: 80%;
    }
    ul.pfo_img22_3_ul li {
        width: 50%;
        margin: 2vw 0;
    }
    ul.pfo_img22_3_ul li img {
        width: 20vw;
    }
    ul.pfo_img22_3_ul li span {
        font-size: 1.8vw;
        margin: 1vw 0;
        line-height: 1.4
    }
}

.inner_img img.t0l0 {
    top: 0;
    left: 0;
}

.inner_img img.t0r0 {
    top: 0;
    right: 0;
}

.inner_img img.b0l0 {
    bottom: 0;
    left: 0;
}

.inner_img img.b0r0 {
    bottom: 0;
    right: 0;
}


/* history_slide */

.his_slide {
    position: relative;
}

.his_slide .bx-controls-direction {
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    font-size: 0;
    z-index: 2;
    text-align: right;
}

.his_slide .bx-wrapper .bx-controls-direction a {
    position: absolute;
    width: 3.59375vw;
    height: 3.59375vw;
    background-size: cover;
    text-indent: -9999px;
}

.his_slide .bx-wrapper .bx-next {
    right: 0;
    background: url(/img/his_next.jpg) no-repeat;
}

.his_slide .bx-wrapper .bx-prev {
    left: 0;
    background: url(/img/his_prev.jpg) no-repeat;
}

.his_slide dl dd img {
    display: block;
}

.his_slide dl dd .text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 9% 21%;
}

.his_slide dl dd .text p {
    position: absolute;
    top: 32%;
    left: 9%;
    color: #fff;
    opacity: 0.5;
    font-size: 1.875vw;
}

.his_slide dl dd .text p.right {
    left: auto;
    right: 9%;
}

.his_slide dl dd h5 {
    margin-bottom: 3%;
    color: #e41957;
    font-size: 2.9296875vw;
    font-weight: 500;
    letter-spacing: -0.05em;
}

.his_slide dl dd ul li {
    float: none;
    width: 100%;
    color: #fff;
    margin-bottom: 2%;
    font-weight: 300;
    letter-spacing: -0.05em;
    font-size: 1.171875vw;
}

.his_slide dl dd ul li span {
    display: inline-block;
    margin-right: 1.5%;
    color: #999;
}

#member {
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
    margin-bottom: 120px;
}

#member #policy {
    font-size: 1.40625vw;
    word-break: keep-all;
    color: #222;
    font-weight: 300;
}

#member #policy h5 {
    margin-top: 2.5%;
    font-size: 1.40625vw;
    color: #e41957;
}

#member #policy ul {
    margin-top: 1%;
    padding-left: 1%
}

#member #policy ul li {
    color: #666;
}

#member #policy a {
    font-size: 1.40625vw;
    color: #222;
    cursor: text;
}

@media all and (max-width:1450px) {
    .organization_bi {
        background-position: center -50%;
    }
    .organization_bi .con01 {
        height: 780px;
    }
    .organization_bi .con01 .circle {
        width: 200px;
        height: 200px;
    }
    .organization_bi .con01 .circle p {
        font-size: 26px;
    }
    .organization_bi .con01 .f_size p {
        font-size: 21px;
    }
    .organization_bi .con01 .circle p span {
        font-size: 22px;
    }
    .organization_bi .con01 .dep01 {
        width: 210px;
        height: 210px;
    }
    .organization_bi .con01 .dep01 p {
        margin-top: 135px;
        font-size: 35px;
    }
    .organization_bi .con01 .dep02 p {
        margin-top: 115px;
    }
    .organization_bi .con01 .dep03 p {
        margin-top: 105px;
    }
    .organization_bi .con01 .pos01 {
        top: 0;
    }
    .organization_bi .con01 .pos02 {
        top: 230px;
        left: 26%;
    }
    .organization_bi .con01 .pos03 {
        top: 230px;
        left: 0;
    }
    .organization_bi .con01 .pos04 {
        top: 230px;
        right: 26%;
    }
    .organization_bi .con01 .pos05 {
        top: 230px;
        right: 0;
    }
    .organization_bi .con01 .pos06 {
        top: 500px;
        left: 0;
    }
    .organization_bi .con01 .pos07 {
        top: 500px;
        left: 16.7%;
    }
    .organization_bi .con01 .pos08 {
        top: 500px;
        left: 33.5%;
    }
    .organization_bi .con01 .pos09 {
        top: 500px;
        right: 33.5%;
    }
    .organization_bi .con01 .pos10 {
        top: 500px;
        right: 16.7%;
    }
    .organization_bi .con01 .pos11 {
        top: 500px;
        right: 0;
    }
    .organization_bi .con01 .pos06 p {
        margin-top: 100px;
    }
}

@media all and (max-width:1300px) {
    .pfo_visual {
        padding-bottom: 8%;
        padding-top: 0;
    }
    /*0922*/
    .pfo_visual .top_logo {
        display: block;
        width: 20%;
        margin: 3.599% auto 2.799%;
    }
    .pfo_visual .top_txt p {
        font-size: 1.25vw;
    }
    /* .pfo_visual .top_img.mo_mockup img {width:40%;} */
    .pfo_visual .top_txt2 {
        margin-top: 2%;
    }
    .pfo_visual .top_txt2 h5 {
        font-size: 20px;
    }
    .pfo_visual .top_txt2 p {
        font-size: 17px;
        word-break: keep-all;
    }
    .pfo_visual.type03 .top_txt {
        margin-bottom: 10%;
    }
    .foot_common .container01 {
        margin-bottom: 10%;
    }
    .pfo_con {
        margin-bottom: 10%;
    }
    .pfo_con .inner_img p {
        font-size: 17px;
        padding: 5% 0;
    }
    .pfo_con .sig_type01,
    .pfo_con .sig_type02 {
        width: 100%;
    }
    .pfo_con .color_type {
        width: 100%;
    }
    .pfo_con .sub09_color ul li {
        font-size: 13px;
    }
    .pfo_con .sub11_color ul li>div {
        height: auto;
        font-size: 13px;
    }
    .pfo_con .sub11_color ul li:nth-of-type(2n)>div {
        padding: 5% 3%;
    }
    .pfo_con .sub11_color ul li p {
        font-size: 16px;
    }
    .pfo_con .sub12_color ul li {
        padding: 8.8% 0;
        font-size: 13px;
    }
    .sub_container ul li.textPart dl {
        font-size: 16px;
    }
    .sub_container ul li.textPart dl a {
        font-size: 16px;
    }
    .sub_container ul li.textPart dl dt {
        width: 25%;
        margin-bottom: 0;
    }
    .sub_container ul li.textPart dl dd {
        width: 75%;
        margin-bottom: 0;
    }
    .sub_container ul li.textPart dl dd a {
        margin-top: 1%;
    }
    .about_con01,
    .about_con02,
    .about_con03,
    .about_con04,
    .about_con05,
    .about_con06 {
        margin-bottom: 10%;
    }
    .organization_bi {
        background-position: center -80%;
    }
    .organization_bi .con01 {
        height: 600px;
    }
    .organization_bi .con01 .circle {
        width: 160px;
        height: 160px;
    }
    .organization_bi .con01 .circle p {
        font-size: 22px;
    }
    .organization_bi .con01 .f_size p {
        font-size: 17px;
    }
    .organization_bi .con01 .circle p span {
        font-size: 18px;
    }
    .organization_bi .con01 .dep01 {
        width: 170px;
        height: 170px;
    }
    .organization_bi .con01 .dep01 p {
        margin-top: 115px;
        font-size: 30px;
    }
    .organization_bi .con01 .dep02 {
        background: #302f30 url(/img/organization_icon02.png) no-repeat center 25%;
    }
    .organization_bi .con01 .dep02 p {
        margin-top: 90px;
    }
    .organization_bi .con01 .dep03 {
        background: #262626 url(/img/organization_icon03.png) no-repeat center 15%;
    }
    .organization_bi .con01 .dep03 p {
        margin-top: 85px;
    }
    .organization_bi .con01 .pos02 {
        top: 180px;
    }
    .organization_bi .con01 .pos03 {
        top: 180px;
    }
    .organization_bi .con01 .pos04 {
        top: 180px;
    }
    .organization_bi .con01 .pos05 {
        top: 180px;
    }
    .organization_bi .con01 .pos06 {
        top: 400px;
    }
    .organization_bi .con01 .pos07 {
        top: 400px;
    }
    .organization_bi .con01 .pos08 {
        top: 400px;
        margin-left: -80px;
    }
    .organization_bi .con01 .pos09 {
        top: 400px;
    }
    .organization_bi .con01 .pos10 {
        top: 400px;
    }
    .organization_bi .con01 .pos11 {
        top: 400px;
    }
    .organization_bi .con01 .pos06 p {
        margin-top: 80px;
    }
    .organization_bi .con02 ul li h5 {
        font-size: 30px;
    }
    .organization_bi .con02 ul li span {
        font-size: 26px;
    }
    .organization_bi .con02 ul li p {
        font-size: 16px;
    }
    .organization_bi .con02 ul li p span.vih {
        font-size: 16px;
    }
    .organization_bi .con02 ul li>img {
        display: inline-block;
        width: 20%;
    }
    .clients_bi ul {
        margin: 5% 3.937% 2.5%;
    }
    .clients_bi ul li {
        width: 22.222%;
        margin-right: 3.7%;
        margin-bottom: 3.7%;
    }
    .clients_bi ul li:nth-of-type(5n) {
        margin-right: 3.7%;
    }
    .clients_bi ul li:nth-of-type(4n) {
        margin-right: 0;
    }
    .recruit_bi {
        margin-bottom: 10%;
    }
    .recruit_bi ul li {
        width: 50%;
    }
    .recruit_bi ul li .txt i {
        font-size: 80px;
    }
    .recruit_bi ul li .txt h5 {
        font-size: 38px;
    }
    .recruit_bi ul li .txt span {
        font-size: 30px;
    }
    .recruit_bi ul li .txt p {
        font-size: 28px;
    }
    .recruit_bi ul li.on .txt i {
        font-size: 82px;
    }
    .recruit_bi ul li.on .txt h5 {
        font-size: 40px;
    }
    .recruit_bi ul li.on .txt span {
        font-size: 32px;
    }
    .recruit_bi ul li.on .txt p {
        font-size: 30px;
    }
    .recruit_bi a.link {
        position: relative;
        top: 0;
        left: 0;
        font-size: 14px;
        width: 13%;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
    .recruit_bi a.link i {
        font-size: 17px;
    }
    .location_bi .txt_wrap dl dt {
        font-size: 17px;
    }
    .location_bi .txt_wrap dl dd {
        font-size: 14px;
    }
    .location_bi .txt_wrap dl dd.num {
        font-size: 13px;
    }
    .location_bi .txt_wrap dl dd.num a {
        font-size: 13px;
    }
    .location_bi .txt_wrap .btn a {
        font-size: 13px;
    }
    .notice_bi ul li {
        width: calc(50% - 5px);
        height: auto;
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .notice_bi ul li:nth-of-type(4n) {
        margin-right: 10px;
    }
    .notice_bi ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .notice_bi ul li span {
        font-size: 26px;
    }
    .notice_bi ul li h5 {
        font-size: 30px;
    }
    .notice_bi ul li p {
        font-size: 20px;
    }
    .notice_read .read_wrap .tit {
        padding: 18px 25px 18px 30px;
    }
    .notice_read .read_wrap .tit h6 {
        font-size: 25px;
    }
    .notice_read .read_wrap .tit p {
        margin-top: 5px;
        font-size: 18px;
    }
    .notice_read .read_wrap .detail {
        padding: 30px 30px 90px;
        font-size: 20px;
    }
    .notice_read .btn_type {
        margin-top: 30px;
    }
    .notice_read .btn_type a {
        font-size: 17px;
        width: 120px;
    }
    .notice_read a.enter {
        font-size: 22px;
        width: 200px;
    }
    .rec_form .tit {
        padding: 0 0 0 40px;
    }
    .rec_form .tit span {
        padding: 0;
        font-size: 25px;
        line-height: 72px;
    }
    .rec_form .tit p {
        width: auto;
        height: 72px;
    }
    .rec_form .tit p img {
        width: auto;
        height: 72px;
    }
    .rec_form .detail_type table th {
        font-size: 17px;
    }
    .rec_form .detail_type table td {
        font-size: 17px;
        padding: 15px 2%;
    }
    .rec_form .detail_type table td input {
        height: 40px;
        font-size: 15px;
    }
    .rec_form .detail_type table td span {
        font-size: 17px;
    }
    .rec_form .detail_type table td label {
        font-size: 17px;
    }
    .rec_form .detail_type .agree {
        margin-top: 20px;
        font-size: 14px;
    }
    .rec_form .detail_type .agree input {
        width: 15px;
        height: 15px;
        vertical-align: middle;
    }
    .rec_form .detail_type .agree label {
        display: inline-block;
        vertical-align: middle;
        margin-top: 0.3%;
    }
    .rec_form .detail_type .agree a {
        width: 14%;
        font-size: 14px;
    }
    .rec_form>a {
        margin: 1.8% auto 0;
        padding: 1.2% 0;
        width: 20%;
        font-size: 21px;
    }
    .rec_form>a i {
        font-size: 17px;
    }
    .rec_form .rec_end {
        font-size: 35px;
        padding: 150px 0;
    }
}


/* 모바일 */

@media all and (max-width:999px) {
    #wrap {
        background-size: 120%;
    }
    .pfo_visual {
        /*padding-top:18%;*/
    }
    .pfo_visual .top_logo {
        margin-top: 0;
    }
    .pfo_visual .top_txt h4 {
        font-size: 35px;
    }
    /*font-size:50px;*/
    .pfo_visual .top_txt h4.type02 {
        padding-left: 8.008vw;
        padding-right: 8.008vw;
    }
    .pfo_visual .top_txt h4.type02 span {
        font-size: 45px;
    }
    .pfo_visual .top_txt_sdn {
        margin-bottom: 4% !important;
    }
    .pfo_visual .top_txt_sdn h4 {
        font-size: 30px;
    }
    .pfo_visual .top_txt p {
        font-size: 16px;
    }
    .pfo_con .sig_type01.mb70 {
        margin-bottom: 8%;
    }
    .pfo_con .sub11_color ul li>div {
        height: 7.3vw;
    }
    .pfo_con .sub12_color ul li {
        width: 48%;
        margin: 0 4% 3% 0;
        padding: 15% 0;
        font-size: 13px;
    }
    .pfo_con .sub12_color ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .pfo_con .sub12_color ul li:first-child {
        background-size: auto 100%;
    }
    .pfo_con .sub12_color ul li:nth-of-type(2) {
        background-size: auto 100%;
    }
    .pfo_con .sub12_color ul li:nth-of-type(3) {
        background-size: auto 100%;
    }
    .pfo_con .sub12_color ul li:nth-of-type(4) {
        background-size: auto 100%;
    }
    .organization_bi {
        background: #1a1a1a;
    }
    .organization_bi .con01 {
        height: auto;
        overflow: hidden;
    }
    .organization_bi .con01 .circle {
        position: relative;
        display: block;
        float: left;
        margin: 0 calc((100% - 325px) / 4) 5%;
    }
    .organization_bi .con01 .dep01 {
        float: none;
        margin: 0 auto 5%;
    }
    .organization_bi .con01 .dep01 p {
        margin-top: 0;
        padding-top: 115px;
    }
    .organization_bi .con01 .dep02 p {
        margin-top: 0;
        padding-top: 90px;
    }
    .organization_bi .con01 .dep03 p {
        margin-top: 0;
        padding-top: 85px;
    }
    .organization_bi .con01 .pos01 {
        top: 0;
        left: 0;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
    .organization_bi .con01 .pos02 {
        top: 0;
        left: 0;
    }
    .organization_bi .con01 .pos03 {
        top: 0;
        left: 0;
    }
    .organization_bi .con01 .pos04 {
        top: 0;
        right: 0;
    }
    .organization_bi .con01 .pos05 {
        top: 0;
        right: 0;
    }
    .organization_bi .con01 .pos06 {
        top: 0;
        left: 0;
    }
    .organization_bi .con01 .pos07 {
        top: 0;
        left: 0;
    }
    .organization_bi .con01 .pos08 {
        top: 0;
        left: 0;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
    .organization_bi .con01 .pos09 {
        top: 0;
        right: 0;
    }
    .organization_bi .con01 .pos10 {
        top: 0;
        right: 0;
    }
    .organization_bi .con01 .pos11 {
        top: 0;
        right: 0;
    }
    .organization_bi .con01 .pos06 p {
        margin-top: 0;
        padding-top: 80px;
    }
    .organization_bi .con02 {
        margin-top: 5%;
    }
    .organization_bi .con02 ul li {
        height: auto;
        float: none;
        width: calc(100% - 2px);
        margin-right: 0%;
        margin-bottom: 3%;
        padding: 10% 5%;
    }
    .clients_bi ul {
        margin: 5% 4.1% 2.5%;
    }
    .clients_bi ul li {
        width: 30.135%;
        margin-right: 4.79%;
        margin-bottom: 4.79%;
    }
    .clients_bi ul li:nth-of-type(5n) {
        margin-right: 4.79%;
    }
    .clients_bi ul li:nth-of-type(4n) {
        margin-right: 4.79%;
    }
    .clients_bi ul li:nth-of-type(3n) {
        margin-right: 0;
    }
    .recruit_bi ul li .txt {
        top: 35%;
    }
    .recruit_bi ul li .txt i {
        font-size: 60px;
    }
    .recruit_bi ul li .txt h5 {
        font-size: 30px;
    }
    .recruit_bi ul li .txt span {
        font-size: 24px;
    }
    .recruit_bi ul li .txt p {
        font-size: 20px;
    }
    .recruit_bi ul li.on .txt i {
        font-size: 62px;
    }
    .recruit_bi ul li.on .txt h5 {
        font-size: 32px;
    }
    .recruit_bi ul li.on .txt span {
        font-size: 26px;
    }
    .recruit_bi ul li.on .txt p {
        font-size: 22px;
    }
    .recruit_bi a.link {
        padding: 2% 0;
        margin: 2% auto 0;
        width: 22%;
    }
    .location_bi .txt_wrap {
        position: relative;
        top: auto;
        right: auto;
        width: 100%;
    }
    .location_bi .txt_wrap .inner {
        display: block;
        width: 100%;
        height: 100%;
    }
    .location_bi .txt_wrap .con_dtc {
        display: block;
        padding: 5% 1.5%;
    }
    .location_bi .txt_wrap .con_dtc .text01 {
        overflow: hidden;
    }
    .location_bi .txt_wrap dl {
        float: left;
        width: 50%;
        box-sizing: border-box;
        padding: 0 2%;
    }
    .location_bi .txt_wrap dl dd {
        word-break: keep-all;
    }
    .location_bi .txt_wrap .btn {
        text-align: center;
    }
    .location_bi .txt_wrap .btn a {
        width: 25%;
        margin-right: 0;
        font-size: 15px;
    }
    .location_bi .txt_wrap .btn a.pc_display {
        display: none;
    }
    .notice_bi ul li {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }
    .notice_bi ul li:nth-of-type(4n) {
        margin-right: 0;
    }
    .notice_bi ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .notice_bi ul li span {
        font-size: 22px;
    }
    .notice_bi ul li h5 {
        font-size: 26px;
        margin: 2% 0 4%;
        width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    .notice_bi ul li p {
        font-size: 17px;
    }
    .notice_read .read_wrap .tit {
        padding: 3% 5% 3%;
    }
    .notice_read .read_wrap .tit h6 {
        font-size: 16px;
    }
    .notice_read .read_wrap .tit p {
        font-size: 12px;
    }
    .notice_read .read_wrap .detail {
        padding: 5% 3% 15%;
        font-size: 14px;
    }
    .notice_read .btn_type {
        margin: 3% 0;
    }
    .notice_read .btn_type a {
        display: inline-block;
        width: 20%;
        margin-left: 1.5%;
        font-size: 13px;
        padding: 2% 0;
    }
    .notice_read a.enter {
        margin: 5% auto 20%;
        width: 30%;
        font-size: 14px;
        padding: 3.5% 0;
    }
    .recf_wrap {
        margin-bottom: 10%;
    }
    .rec_form .tit {
        padding: 0 0 0 20px;
    }
    .rec_form .tit span {
        padding: 0;
        font-size: 20px;
        line-height: 40px;
    }
    .rec_form .tit p {
        width: auto;
        height: 40px;
    }
    .rec_form .tit p img {
        width: auto;
        height: 40px;
    }
    .rec_form .detail_type {
        padding: 3% 1.25%;
    }
    .rec_form .detail_type table th {
        font-size: 14px;
        padding: 0;
    }
    .rec_form .detail_type table td {
        font-size: 14px;
        padding: 10px 1.5%;
    }
    .rec_form .detail_type table td input {
        width: 100%;
        height: 30px;
        font-size: 14px;
    }
    .rec_form .detail_type table td input.size02 {
        width: 30%;
    }
    .rec_form .detail_type table td span {
        font-size: 14px;
    }
    .rec_form .detail_type table td span.size02 {}
    .rec_form .detail_type table td p {
        padding-top: 7px;
    }
    .rec_form .detail_type table td label {
        display: inline-block;
        font-size: 14px;
        margin-right: 3%;
    }
    .rec_form .detail_type table td label input+i {
        width: 15px;
        height: 15px;
    }
    .rec_form .detail_type table td textarea {
        height: 150px;
    }
    .rec_form .detail_type .agree {
        font-size: 14px;
        padding: 0;
        margin-top: 5%;
    }
    .rec_form .detail_type .agree input {
        width: 15px;
        height: 15px;
        vertical-align: middle;
    }
    .rec_form .detail_type .agree label {
        display: inline-block;
        vertical-align: middle;
        margin-top: 0.3%;
    }
    .rec_form .detail_type .agree a {
        width: 20%;
        padding: 2% 0;
    }
    .rec_form>a {
        margin: 1.8% auto 0;
        padding: 2% 0;
        width: 30%;
        font-size: 16px;
    }
    .rec_form>a i {
        font-size: 17px;
    }
    .his_slide .bx-wrapper .bx-controls-direction a {
        width: 7.5409836066vw;
        height: 7.5409836066vw;
    }
    .his_slide dl dd .text p {
        font-size: 4.0983606557vw;
    }
    .his_slide dl dd h5 {
        font-size: 6.1475409836vw;
    }
    .his_slide dl dd ul li {
        font-size: 2.4590163934vw;
    }
    #member {
        margin-bottom: 9%;
    }
    #member #policy {
        font-size: 14px;
    }
    #member #policy h5 {
        margin-top: 7%;
        font-size: 14px;
    }
    #member #policy ul {
        margin-top: 3%;
    }
    #member #policy a {
        font-size: 14px;
    }
}

@media all and (max-width:700px) {
    .pfo_con .sub11_color ul li>div {
        height: 8.5vw;
    }
}

@media all and (max-width:640px) {
    .rec_form .detail_type table td p {
        width: 50%;
    }
    .rec_form .rec_end {
        font-size: 18px;
        padding: 25% 0;
    }
}

@media all and (max-width:550px) {
    #wrap {
        background-size: 180%;
    }
    .pfo_visual.type04 {
        padding-bottom: 45%;
    }
    .pfo_visual.type05 .top_txt2 {
        margin-top: 5%;
    }
    .pfo_con .sig_type01.mb70 {
        margin-bottom: 0;
    }
    .pfo_con .sig_type01 ul {
        width: 90%;
        margin: 0 auto;
    }
    .pfo_con .sig_type01 ul li {
        width: 100%;
        margin-bottom: 5%;
    }
    .pfo_con .sig_type01 ul li:first-child {
        margin-right: 0;
    }
    .pfo_con .sig_type02 ul {
        width: 90%;
        margin: 0 auto;
    }
    .pfo_con .sig_type02 ul li {
        width: 100%;
        margin: 0 0 5% 0;
    }
    .pfo_con .sub09_color ul {
        width: 90%;
        margin: 0 auto;
    }
    .pfo_con .sub09_color ul li {
        float: none;
        width: 100%;
        margin: 0 0 3% 0;
        padding: 3% 4%
    }
    .pfo_con .sub09_color ul li:nth-of-type(3n) {
        margin-right: 0;
    }
    .pfo_con .sub11_color ul {
        width: 90%;
        margin: 0 auto;
    }
    .pfo_con .sub11_color ul li {
        width: 100%;
    }
    .pfo_con .sub11_color ul li:first-child {
        margin: 0 0 5% 0;
    }
    .pfo_con .sub11_color ul li>div {
        height: auto;
        padding: 3% 4%;
    }
    .sub_container ul li.textPart dl dt {
        float: none;
        width: 100%;
    }
    .sub_container ul li.textPart dl dd {
        float: none;
        width: 100%;
        margin-bottom: 3%;
    }
    .sub_container ul li.textPart dl dd a:nth-of-type(1) img {
        width: 24.026%;
    }
    .sub_container ul li.textPart dl dd a:nth-of-type(2) img {
        width: 34.2%;
    }
    .sub_container ul li.textPart dl dd a:nth-of-type(3) img {
        width: 31.17%;
    }
    .organization_bi .con01 .circle {
        width: 140px;
        height: 140px;
        margin: 0 calc((100% - 290px) / 4) 5%;
    }
    .organization_bi .con01 .circle p {
        font-size: 20px;
    }
    .organization_bi .con01 .f_size p {
        font-size: 15px;
    }
    .organization_bi .con01 .dep01 {
        margin: 0 auto 5%;
    }
    .organization_bi .con01 .dep01 p {
        padding-top: 100px;
    }
    .organization_bi .con01 .dep02 p {
        padding-top: 80px;
    }
    .organization_bi .con01 .dep03 p {
        padding-top: 75px;
    }
    .clients_bi ul {
        margin: 3.723% 3.723% 1.862%;
    }
    .clients_bi ul li {
        width: 48%;
        margin-right: 2%;
        margin-bottom: 2%;
        box-shadow: 5px 0 5px rgba(0, 0, 0, 0.29);
    }
    .clients_bi ul li:nth-of-type(5n) {
        margin-right: 2%;
    }
    .clients_bi ul li:nth-of-type(4n) {
        margin-right: 2%;
    }
    .clients_bi ul li:nth-of-type(3n) {
        margin-right: 2%;
    }
    .clients_bi ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .recruit_bi ul li {
        width: 100%;
        height: 120vw;
    }
    .recruit_bi ul li img {
        margin-top: -20%;
    }
    .recruit_bi ul li .txt i {
        font-size: 50px;
    }
    .recruit_bi ul li .txt h5 {
        font-size: 26px;
    }
    .recruit_bi ul li .txt span {
        font-size: 20px;
    }
    .recruit_bi ul li .txt p {
        font-size: 18px;
    }
    .recruit_bi ul li.on .txt i {
        font-size: 52px;
    }
    .recruit_bi ul li.on .txt h5 {
        font-size: 28px;
    }
    .recruit_bi ul li.on .txt span {
        font-size: 22px;
    }
    .recruit_bi ul li.on .txt p {
        font-size: 20px;
    }
    .recruit_bi a.link {
        padding: 4% 0;
        width: 35%;
    }
    .notice_read .read_wrap .tit h6 {
        width: 78%;
    }
    .notice_read .read_wrap .tit p {
        width: 22%;
    }
    .rec_form .detail_type table td p {
        width: 50%;
    }
    .rec_form .detail_type table td p>input.size02 {
        width: 25%;
        padding: 0 1px;
    }
    .rec_form .detail_type table td p.size02 {
        width: 100%;
    }
    .rec_form .detail_type table td p>input.size03 {
        width: 34%;
    }
    .his_slide dl dd ul li {
        font-size: 10px;
        letter-spacing: -0.07em;
    }
    .his_slide dl dd h5 {
        margin-bottom: 2%
    }
}

@media all and (max-width:330px) {
    .pfo_visual .top_txt h4 {
        font-size: 27px;
    }
    /*font-size:40px;*/
    .pfo_visual .top_txt_sdn {
        margin-bottom: 4% !important;
    }
    .pfo_visual .top_txt_sdn h4 {
        font-size: 20px;
    }
    .rec_form .detail_type table th {
        font-size: 13px;
    }
    .rec_form .detail_type table td {
        font-size: 13px;
    }
    .his_slide dl dd .text {
        padding: 7% 18%;
    }
    .his_slide dl dd ul li {
        font-size: 10px;
        letter-spacing: -0.1em;
    }
    .his_slide dl dd ul li span {
        margin-right: 0.5%;
    }
}


/* sub_visual */

.sub_visual {
    margin-bottom: 105px;
    padding: 0 1.15%;
    box-sizing: border-box;
    padding-top: 260px;
    padding-bottom: 210px;
}

.sub_bgt01 {
    background: url(/img/sub_title_bg.png)no-repeat top;
    background-size: cover
}

.sub_bgt02 {
    background: url(/img/sub_title_bg2.png)no-repeat top;
    background-size: cover
}

.sub_bgt03 {
    background: url(/img/sub_title_bg3.png)no-repeat top;
    background-size: cover
}

.sub_bgt04 {
    background: url(/img/sub_title_bg4.png)no-repeat top;
    background-size: cover
}

.sub_bgt05 {
    background: url(/img/sub_title_bg5.png)no-repeat top;
    background-size: cover
}

.sub_bgt06 {
    background: url(/img/sub_title_bg6.png)no-repeat top;
    background-size: cover
}

.sub_bgt08 {
    background: url(/img/sub_title_bg8.png)no-repeat top;
    background-size: cover
}

.sub_bgt09 {
    background: url(/img/sub_title_bg9.png)no-repeat top;
    background-size: cover
}


/* 서브 gif 파일 이미지 크기 */

.gif_img {
    width: 90% !important;
    padding-left: 5%
}

.gif_img2 {
    width: 71% !important;
    padding-left: 10%
}

.gif_img3 {
    width: 86% !important;
    padding-left: 4%
}

.gif_img4 {
    width: 82% !important;
    padding-left: 8%
}

.gif_img5 {
    width: 82% !important;
    padding-right: 10%
}

.gif_img6 {
    width: 82% !important;
    padding-left: 10%
}

.sub_visual ul {
    display: table;
    vertical-align: middle;
}

.sub_visual ul li {
    display: table-cell;
    width: 50%;
    vertical-align: middle;
}

.sub_visual ul li img {
    width: 100%;
}

.sub_visual ul li p {
    float: right;
    width: 92%;
    margin-top: 38px;
    padding-right: 5.7%;
    font-size: 30px;
    box-sizing: border-box;
    word-break: keep-all;
    letter-spacing: -0.05em;
    color: #fff;
    font-weight: 300;
}

.sub_visual ul li p strong {
    font-weight: 500;
}

.sub_visual ul li p.large {
    width: 91%;
}

.sub_visual ul li p span.col01 {
    color: #e4185d;
}

.sub_visual ul li p span.col02 {
    color: #5ac102;
}

.sub_visual ul li p span.col03 {
    color: #4972f6;
}

.sub_visual ul li p span.col04 {
    color: #656566;
}

.sub_visual ul li p span.col05 {
    color: #222e77;
}


/* sub_container */

.sub_container ul {
    overflow: hidden;
    margin-bottom: 0;
}

.sub_container ul li {
    float: left;
    position: relative;
    width: 50%;
}

.sub_container ul li>img {
    width: 100%;
    display: block;
}

.sub_container.rightType ul li {
    float: right;
}

.sub_container ul li.textPart {
    box-sizing: border-box;
    padding: 6.843% 5% 0 6.843%;
    word-break: keep-all;
}

.sub_container ul li.textPart span {
    font-size: 1.171875vw;
    /* font-size:30px;*/
    line-height: 1;
}

.sub_container ul li.textPart h3 {
    margin-bottom: 4.747%;
    font-size: 5.859375vw;
    /*font-size:150px;*/
    line-height: 1;
    letter-spacing: -0.07em;
    font-weight: 500;
    word-break: break-word;
}

.sub_container ul li.textPart p {
    margin-bottom: 4.747%;
    /*font-size:32px;*/
    font-size: 1.25vw;
    letter-spacing: -0.025em;
    color: #000;
}

.sub_container ul li.textPart .last {
    color: #666;
    /*font-size:26px;*/
    font-size: 1.015625vw;
}

.sub_container ul li.textPart span.col01 {
    color: #f00143;
}

.sub_container ul li.textPart span.col02 {
    color: #52deff;
}

.sub_container ul li.textPart span.col03 {
    color: #0d4c95;
}

.sub_container ul li.textPart span.col04 {
    color: #6401c1;
}

.sub_container ul li.textPart span.col05 {
    color: #3390fa;
}

.sub_container ul li.textPart span.col06 {
    color: #783dbe;
}

.sub_container ul li.textPart span.col07 {
    color: #4a72f6;
}

.sub_container ul li.textPart span.col08 {
    color: #20252e;
}

.sub_container ul li.textPart span.col09 {
    color: #e3175c;
}

.sub_container ul li.textPart span.col10 {
    color: #6798ff
}

.sub_container ul li.textPart span.col11 {
    color: #4f2cff
}

.sub_container ul li.textPart span.col12 {
    color: #e71b00;
}

.sub_container ul li.textPart span.col13 {
    color: #177fd4;
}

.sub_container ul li.textPart span.col14 {
    color: #00aeb5;
}

.sub_container dl dd img {
    width: 100%;
}

.footer-logo {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 245px;
}

.top-center {
    /* position: absolute;
    left: 50%;
    transform: translate(calc(-50%), 0px); */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: 0 20px;
}

@media screen and (max-width: 890px) {
    .footer-logo {
        display: none;
    }
}


/* 서브타이틀 */

.sub h4 {
    /*font-size:110px;*/
    font-size: 2.6vw;
    text-align: center;
    letter-spacing: -0.025em;
    margin-bottom: 15px;
}

.sub h6 {
    /*font-size:110px;*/
    font-size: 2.296875vw;
    text-align: center;
    letter-spacing: -0.025em;
}

.sub h5 {
    /*font-size:110px;*/
    font-size: 3.156875vw;
    text-align: center;
    letter-spacing: -0.025em;
    font-weight: 500;
    word-break: keep-all;
}

.sub .sub_text {
    margin-bottom: 45px;
    /*font-size:32px;*/
    font-size: 1.25vw;
    text-align: center;
    letter-spacing: -0.025em;
    word-break: keep-all;
}

.sub .sub_text p {
    /*font-size:34px;*/
    font-size: 1.328125vw;
    font-weight: 500;
    color: #000;
    margin: 0px 0 15px;
}

@media screen and (min-width: 1300px) {
    .sub .sub_text p {
        margin: 28px 0 15px !important;
    }
}

.sub h4 .col02 {
    color: #e2195d;
}

.sub h5 .col03 {
    color: #1b64de;
}

.sub .sub_text span.col01 {
    color: #e2195d;
}

.sub .sub_text span.col03 {
    color: #1b64de;
}


/* 서브타이틀 */

.sub_new h4 {
    font-size: 2.6vw;
    text-align: center;
    letter-spacing: -0.05em;
    margin: 0;
}

.sub_new .sub_text {
    margin: 10px 0 40px;
    font-size: 1.07vw;
    text-align: center;
    letter-spacing: -0.05em;
    color: #222;
    word-break: keep-all;
}

.sub_new .sub_text p {
    font-size: 1.8vw;
    color: #000;
    letter-spacing: -0.075em;
}

.sub_new .sub_text p span {
    font-size: 500;
}

.sub_new .sub_text p span.col01 {
    color: #ff395d;
}

.sub_new .sub_text p span.col02 {
    color: #6798ff;
}

.sub_new .sub_text p span.col03 {
    color: #fb6ea0;
}


/* homepage */

.website_con01 {
    margin-bottom: 120px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.website_con02 {
    margin-bottom: 180px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.website_con02 ul {
    overflow: hidden;
}

.website_con02 ul li {
    position: relative;
    float: left;
    width: 50%;
}

.website_con02 ul li img {
    width: 100%;
}

.website_con02 ul li p {
    position: absolute;
    top: 6%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 2vw;
    color: #000;
    letter-spacing: -0.05em;
    font-weight: 700;
}

.website_con02 ul li p.hver {
    color: #fff;
}

.website_con03 {
    margin-bottom: 180px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.website_con03 .img_part img {
    width: 100%;
    display: block;
}

.inner_type {
    padding: 0 1.15%;
    box-sizing: border-box;
}

.inner_type .container01 {
    margin-bottom: 100px;
}


/* mobile */

.mobile_con01 {
    margin-bottom: 120px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.mobile_con02 {
    margin-bottom: 180px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.mobile_con02 ul {
    overflow: hidden;
    background: #202020;
}

.mobile_con02 ul li {
    position: relative;
    float: left;
    width: 33.333%;
    overflow: hidden;
}

.mobile_con02 ul li img {
    width: 100%;
    display: block;
    -webkit-animation-duration: 0.8s;
    animation-duration: 0.8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.mobile_con02 ul li .text_t {
    position: absolute;
    top: 6%;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}

.mobile_con02 ul li .text_t h6 {
    font-size: 1.5625vw;
    color: #fff;
    font-weight: 300;
}

.mobile_con02 ul li .text_t p {
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 1.40625vw;
    color: #fff;
    letter-spacing: -0.025em;
    opacity: 0.5;
    font-weight: 300;
}

.mobile_con02 ul li .text_t span {
    font-size: 1.09375vw;
    color: #fff;
    opacity: 0.7;
    letter-spacing: -0.05em;
}


/* design */

.design_con01 {
    margin-bottom: 120px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.design_con02 {
    margin-bottom: 180px;
    padding: 0 1.15%;
    box-sizing: border-box;
}


/* container02 */

.container02 {
    width: 100%;
}

.container02 ul {
    overflow: hidden;
}

.container02 ul li {
    position: relative;
    float: left;
    width: 25%;
    font-size: 0;
    overflow: hidden;
}

.container02 ul li img {
    width: 100%;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.container02 ul li:hover img {
    -webkit-transform: scale(1.2, 1.2);
    -moz-transform: scale(1.2, 1.2);
    -o-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    transition: all 0.4s linear;
}


/* software */

.solution_tit {
    width: 240px;
    height: 48px;
    background: #e31659;
    line-height: 48px;
    position: absolute;
    left: 50%;
    top: -30px;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
}

.solution_tit p {
    text-align: center;
    font-size: 20px;
    color: #ffffff;
    letter-spacing: 0.4em;
    font-weight: 500;
    text-transform: uppercase;
}

.software_con01 {
    margin-bottom: 120px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.software_con02 {
    margin-bottom: 180px;
    padding: 0 1.15%;
    box-sizing: border-box;
}

.software_con02 .inner_box2 {
    background: #f7f7f7;
    padding: 100px 0;
    margin-top: 80px;
    margin-bottom: 130px;
    position: relative
}

.software_con02 .inner_box2 h5 {
    opacity: 0;
    font-size: 2.34375vw;
    font-weight: 500;
    text-align: center;
    color: #222;
    letter-spacing: -0.025em;
    opacity: 1 \0/IE8+9;
}

.software_con02 .inner_box2 h5 img {
    width: 3.6vw;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -2px;
    margin-right: 15px;
}

.software_con02 .inner_box2 .soft_stext {
    opacity: 0;
    margin: 1% 0 4%;
    font-size: 1.171875vw;
    color: #888;
    text-align: center;
    word-break: keep-all;
    opacity: 1 \0/IE8+9;
}

.software_con02 .inner_box2 ul {
    font-size: 0;
    text-align: center;
}

.software_con02 .inner_box2 ul li {
    opacity: 0;
    display: inline-block;
    width: 18.1640625%;
    margin: 0 1.8% 3.25%;
    vertical-align: top;
    opacity: 1 \0/IE8+9;
    border-top: 1px solid #c9c9c9;
    padding-top: 15px;
    position: relative;
}

.software_con02 .inner_box2 ul li:before {
    content: "";
    width: 19px;
    height: 19px;
    background: #b6b6b6;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: -9px;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
}

.software_con02 .inner_box2 ul li img {
    width: 100%;
}

.software_con02 .inner_box2 ul li h6 {
    margin-bottom: 4%;
    font-size: 1.171875vw;
    color: #222;
    font-weight: 500;
    letter-spacing: -0.025em;
}

.software_con02 .inner_box2 ul li p {
    margin-top: 5%;
    font-size: 1.09375vw;
    color: #888;
}

.software_con02 .inner_box2 a {
    opacity: 0;
    opacity: 1 \0/IE8+9;
    display: block;
    margin: 1.8% auto 0;
    padding: 0.8% 0;
    width: 10.368852459%;
    text-align: center;
    color: #424242;
    font-size: 1.09375vw;
    background: none;
    border: 1px solid #646464;
}

.software_con02 .inner_box2 a i {
    margin: 1.5% 0 0 10%;
    color: #3e4145;
    font-size: 1.3671875vw;
}

.software_con02 .inner_box2.on h5 {
    -webkit-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.1s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.software_con02 .inner_box2.on .soft_stext {
    -webkit-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.2s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.software_con02 .inner_box2.on ul li {
    -webkit-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.3s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.software_con02 .inner_box2.on ul li:nth-of-type(n+5) {
    -webkit-animation: fadeInUp 0.7s 0.4s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.4s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.4s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.4s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.software_con02 .inner_box2.on a {
    -webkit-animation: fadeInUp 0.7s 0.5s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp 0.7s 0.5s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp 0.7s 0.5s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp 0.7s 0.5s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}


/* portfolio 
.port_tab {padding:140px 0;}
.port_tab ul {font-size:0; text-align:right; width:100%;}
.port_tab ul li {display:inline-block; width:15%; border:1px solid #d6d6d6; border-left:0; box-sizing:border-box; text-align:center; vertical-align:top;}
.port_tab ul li:first-child {border-left:1px solid #d6d6d6;}
.port_tab ul li img {display:block; width:62.2%; margin:0 auto 8%;} 
.port_tab ul li.on,.port_tab ul li:hover {background:#e41957; color:#fff; border:1px solid #e41957;}
.port_tab ul li > a{overflow:hidden;display:block; padding:5% 0;font-size:0.78125vw;}
.port_tab ul li.on > a,.port_tab ul li:hover > a {color:#fff; }
*/


/* portfolio */

.port_type {
    background: #ff1844;
}

.port_tab {
    padding: 90px 0 60px;
    padding-top: 0
}

.port_tab ul {
    font-size: 0;
    text-align: center;
    width: 100%;
}

.port_tab ul li {
    display: inline-block;
    width: 180px;
    height: 170px;
    text-align: center;
    vertical-align: top;
    padding: 0;
    border: 1px solid #d6d6d6;
    padding: 19px 0.5%;
    font-size: 0.78125vw;
    box-sizing: border-box;
}

.port_tab ul li img {
    display: block;
    margin: 0 auto 7%;
}

.port_tab ul li.on,
.port_tab ul li:hover {
    background: #618bd7;
    color: #fff;
    border: 1px solid #618bd7;
}

.port_tab ul li:nth-of-type(1).on,
.port_tab ul li:nth-of-type(1):hover {
    background-color: #f40b53;
    border: 1px solid #f40b53;
}

.port_tab ul li:nth-of-type(2).on,
.port_tab ul li:nth-of-type(2):hover {
    background-color: #ff2879;
    border: 1px solid #ff2879;
}

.port_tab ul li:nth-of-type(3).on,
.port_tab ul li:nth-of-type(3):hover {
    background-color: #08b8fc;
    border: 1px solid #08b8fc;
}

.port_tab ul li:nth-of-type(4).on,
.port_tab ul li:nth-of-type(4):hover {
    background-color: #6455cc;
    border: 1px solid #6455cc;
}

.port_tab ul li:nth-of-type(5).on,
.port_tab ul li:nth-of-type(5):hover {
    background-color: #fd570e;
    border: 1px solid #fd570e;
}

.port_tab ul li:nth-of-type(6).on,
.port_tab ul li:nth-of-type(6):hover {
    background-color: #3880ff;
    border: 1px solid #3880ff;
}

.port_tab ul li:nth-of-type(7).on,
.port_tab ul li:nth-of-type(7):hover {
    background-color: #00df9d;
    border: 1px solid #00df9d;
}

.port_tab ul li.on,
.port_tab ul li:hover a {
    color: #fff
}

.port_tab ul li.on a {
    color: #fff
}

@media all and (max-width:1800px) {
    .port_tab ul li {
        font-size: 18px;
    }
}

@media all and (min-width:2560px) {
    .port_tab ul li {
        font-size: 19px;
    }
}


/* portfolio 수정 - 20200420 */

.portfolio {
    background: #f9f9f9;
}

.portfolio_projectBox {
    padding: 0 1.15%;
    padding-bottom: 150px;
    box-sizing: border-box;
    width: 100%;
    max-width: 2560px;
    margin: 0 auto
}

.portfolio_projectBox ul {
    max-width: 2440px;
    margin: 0 auto;
    overflow: hidden;
}

.portfolio_projectBox ul:after {
    content: '';
    display: block;
    clear: both;
}

.portfolio_projectBox ul li {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    width: calc(25% - 15px);
}

.portfolio_projectBox ul li:hover .img_part img {
    transform: scale(1.1) translateX(-50%);
    -ms-transform: scale(1.1) translateX(-50%);
    -webkit-transform: scale(1.1) translateX(-50%);
    -o-transform: scale(1.1) translateX(-50%);
    -moz-transform: scale(1.1) translateX(-50%);
}

.portfolio_projectBox ul li:hover .text_part:before {
    background: #222
}

.portfolio_projectBox ul li:hover .text_part h5 {
    color: #222;
    font-weight: 500;
}

.portfolio_projectBox ul li:hover .text_part p {
    color: #222
}

.portfolio_projectBox ul li:nth-of-type(4n) {
    margin-right: 0;
}

.portfolio_projectBox ul li .img_part {
    position: relative;
    overflow: hidden;
    padding: 50% 0
}

.portfolio_projectBox ul li .img_part img {
    width: 100%;
    transition: all 0.3s;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%)
}

.portfolio_projectBox ul li .text_part {
    height: 80px;
    margin-top: 20px;
    padding: 0 10px 30px;
    box-sizing: border-box;
    word-break: keep-all;
    overflow: hidden;
    position: relative;
}

.portfolio_projectBox ul li .text_part:before {
    content: '';
    display: block;
    position: absolute;
    width: 3px;
    height: 20px;
    background: #c0c0c0;
    left: 0;
    top: 4px;
}

.portfolio_projectBox ul li .text_part h5 {
    display: inline-block;
    vertical-align: top;
    font-size: 17px;
    color: #a7a7a7;
    letter-spacing: 0em;
    font-weight: 300;
    margin: 0;
}

.portfolio_projectBox ul li .text_part p {
    display: inline-block;
    vertical-align: top;
    font-size: 17px;
    color: #a7a7a7;
    letter-spacing: 0em;
    font-weight: 300;
}

.portfolio_projectBox .more_btn {
    width: 74px;
    margin: 10px auto 0;
}

@media all and (max-width:1600px) {
    .portfolio_projectBox ul {
        overflow: hidden;
    }
    .portfolio_projectBox ul li {
        width: calc(33.333333% - 14px);
    }
    .portfolio_projectBox ul li:nth-of-type(4n) {
        margin-right: 20px;
    }
    .portfolio_projectBox ul li:nth-of-type(3n) {
        margin-right: 0;
    }
}

@media all and (max-width:1000px) {
    .portfolio_projectBox ul li {
        width: calc(50% - 10px);
    }
    .portfolio_projectBox ul li:nth-of-type(3n) {
        margin-right: 20px;
    }
    .portfolio_projectBox ul li:nth-of-type(2n) {
        margin-right: 0;
    }
}

@media all and (max-width:999px) {
    .portfolio_projectBox .more_btn {
        width: 11.5625%;
        margin: 1.5% auto 0;
    }
    .portfolio_projectBox ul li .text_part {
        height: auto;
        padding: 0 1vw 3vw;
        margin-top: 2vw
    }
    .portfolio_projectBox ul li .text_part h5 {
        font-size: 14px;
        padding-left: 5px;
        box-sizing: border-box;
    }
    .portfolio_projectBox ul li .text_part:before {
        height: 14px;
    }
}

@media all and (max-width:767px) {
    .portfolio_projectBox ul li {
        width: 100%;
    }
    .portfolio_projectBox ul li:nth-of-type(3n) {
        margin-right: 0;
    }
    .portfolio_projectBox ul li:nth-of-type(2n) {
        margin-right: 0;
    }
}


/* contact */

.contact ul li:first-child {
    width: 50%;
}

.contact ul li:last-child {
    width: calc(100% - 50%);
    text-align: right;
}

.contact ul li:first-child dl {
    float: right;
    margin-top: 3%;
    width: 90%;
    padding-right: 5.7%;
}

.contact ul li:first-child dl dd {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.09375vw;
    color: #fff;
    line-height: 1;
}

.contact ul li:first-child dl dt {
    display: inline-block;
    vertical-align: middle;
}

.contact ul li:first-child dl dt {
    width: 3.535%;
    margin: 0 0.5% 0 4%;
}

.contact ul li:first-child dl dd a {
    font-size: 1.640625vw;
    color: #fff;
}

.contact ul li:first-child dl dd a.num {
    font-size: 1.7578125vw;
    color: #fff;
    cursor: default;
}

.contact_con01 {
    padding: 75px 2.8% 137px;
    margin-bottom: 95px;
    background: #f8f8f8;
    margin: 0 1.15%;
    margin-bottom: 95px;
    box-sizing: border-box;
}

.contact_con01 h4 {
    margin-bottom: 70px;
    font-size: 2.734375vw;
    text-align: center;
}

.contact_con01 ul {
    overflow: hidden;
}

.contact_con01 ul li {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-bottom: 25px;
}

.contact_con01 ul li.half {
    width: 50%;
}

.contact_con01 ul li p {
    float: left;
    width: 9.1796vw;
    line-height: 70px;
    box-sizing: border-box;
    font-size: 1.484375vw;
}

.contact_con01 ul li p span {
    color: #e41957;
}

.contact_con01 ul li.no02 p {
    padding-left: 7%;
}

.contact_con01 ul li>div {
    float: left;
    width: calc(100% - 9.1796vw);
}

.contact_con01 ul li>div input {
    width: 100%;
    height: 70px;
    box-sizing: border-box;
    font-size: 1.2vw;
    padding: 10px;
    border: 1px solid #d5d3d3;
    background: #fff;
}

.contact_con01 ul li>div input.col01 {
    border: 1px solid #e41957;
}

.contact_con01 textarea {
    resize: none;
    width: 100%;
    height: 760px;
    padding: 15px;
    font-size: 1.2vw;
    box-sizing: border-box;
    border: 1px solid #d5d3d3;
}

.contact_con01 .agree_wrap {
    padding: 25px 0;
}

.contact_con01 .agree_wrap input {
    width: 1.171875vw;
    height: 1.171875vw;
    vertical-align: middle;
}

.contact_con01 .agree_wrap label {
    font-size: 1.328125vw;
    letter-spacing: -0.075em;
    color: #444;
}

.contact_con01 .agree_wrap a {
    float: right;
    display: inline-block;
    padding: 1% 0;
    width: 10.368852459%;
    text-align: center;
    color: #fff;
    font-size: 1.328125vw;
    background: #8b8e97;
}

.contact_con01 .btn a {
    display: block;
    margin: 3% auto 0;
    padding: 1.2% 0;
    width: 16%;
    text-align: center;
    color: #fff;
    font-size: 1.6796875vw;
    background: #e41957;
}

.contact_con01 .btnCuzDuplBootrap a {
    display: block;
    margin: 3% auto 0;
    padding: 1.2% 0;
    width: 16%;
    text-align: center;
    color: #fff;
    font-size: 1.6796875vw;
    background: #e41957;
}

.program_table {
    margin: 0 1.15%;
    box-sizing: border-box;
    margin-bottom: 120px
}


/* 동적효과 */

#wrap.about .sub_container ul li .inner img {
    width: 100%;
}

.sub_container ul li .inner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.sub_container ul li .inner img {
    width: 100%;
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.inner img.t0l0 {
    top: 0;
    left: 0;
}

.inner img.t0r0 {
    top: 0;
    right: 0;
}

.inner img.b0l0 {
    bottom: 0;
    left: 0;
}

.inner img.b0r0 {
    bottom: 0;
    right: 0;
}

.inner img.upside {
    transform: translate(0, -1100px);
    -webkit-transform: translate(0, -1100px);
    -moz-transform: translate(0, -1100px);
    -o-transform: translate(0, -1100px);
}

.inner img.under {
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px);
    -moz-transform: translate(0, 1000px);
    -o-transform: translate(0, 1000px);
}

.inner img.leftside {
    transform: translate(-1100px, 0);
    -webkit-transform: translate(-1100px, 0);
    -moz-transform: translate(-1100px, 0);
    -o-transform: translate(-1100px, 0);
}

.inner img.rightside {
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0);
    -moz-transform: translate(1000px, 0);
    -o-transform: translate(1000px, 0);
}

.inner img.sidelt {
    transform: translate(-1000px, -1000px);
    -webkit-transform: translate(-1000px, -1000px);
    -moz-transform: translate(-1000px, -1000px);
    -o-transform: translate(-1000px, -1000px);
}

.inner img.sidert {
    transform: translate(500px, -1000px);
    -webkit-transform: translate(500px, -1000px);
    -moz-transform: translate(500px, -1000px);
    -o-transform: translate(500px, -1000px);
}

.inner img.siderb {
    transform: translate(1000px, 500px);
    -webkit-transform: translate(1000px, 500px);
    -moz-transform: translate(1000px, 500px);
    -o-transform: translate(1000px, 500px);
    -ms-transform: translate(1000px, 500px);
}

.inner img.sidelb {
    transform: translate(-1000px, 500px);
    -webkit-transform: translate(-1000px, 500px);
    -moz-transform: translate(-1000px, 500px);
    -o-transform: translate(-1000px, 500px);
}


/*homepage*/

.sub_container ul li .inner img.web01_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.web01_02 {
    width: 15%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.web01_03 {
    width: 44.2622%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.web01_04 {
    width: 33.0327%;
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.web01_05 {
    width: 39.6721%;
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.web01_06 {
    width: 33.0327%;
    z-index: 4;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.web01_07 {
    width: 30.6557%;
    z-index: 4;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.web02_01 {
    width: 60.6557%;
    z-index: 1;
}

.sub_container ul li .inner img.web02_02 {
    width: 28.9344%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.web02_03 {
    width: 75%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.web03_01 {
    width: 72.1311%;
}

.sub_container ul li .inner img.web03_02 {
    width: 19.836%;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.web03_03 {
    width: 75%;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.web03_04 {
    width: 75%;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.web04_01 {
    width: 100%;
}

.website_con03 .img_part {
    position: relative;
}

.website_con03 .img_part .inner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.website_con03 .img_part .inner img {
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.website_con03 .img_part .inner img.w03_01 {
    width: 47.4180%;
    z-index: 1;
    transform: translate(-100%, 0);
}

.website_con03 .img_part .inner img.w03_02 {
    width: 47.213%;
    top: 0;
    left: 35.0819672131%;
    transition-delay: 0.1s;
    transform: translate(0, -1000%);
}

.website_con03 .img_part .inner img.w03_03 {
    width: 32.6639%;
    transition-delay: 0.2s;
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0);
}

.website_con03 .img_part .inner img.w03_04 {
    width: 17.1311%;
    bottom: 0;
    left: 37.5%;
    transition-delay: 0.3s;
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px);
}

.website_con03 .img_part .inner img.on {
    transform: translate(0, 0);
}

.website_con03 .img_part .inner img:hover {
    z-index: 11;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}


/*mobile*/

.sub_container ul li .inner img.tanz {
    width: 47.295%;
}

.sub_container ul li .inner img.mo01_01 {
    width: 20.3278%;
    z-index: 3;
}

.sub_container ul li .inner img.mo01_02 {
    width: 36.5573%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.mo01_03 {
    width: 55.8196%;
    z-index: 1;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.mo01_06 {
    width: 48.7704%;
    z-index: 4;
    transition-delay: 0.4s;
}

.sub_container ul li .inner img.mo01_04 {
    width: 44.2622%;
    z-index: 1;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.mo01_07 {
    width: 27.9508%;
    z-index: 1;
}

.sub_container ul li .inner img.mo02_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.mo02_02 {
    width: 47.6229%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.mo02_03 {
    width: 29.2622%;
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.mo03_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.mo03_02 {
    width: 45.5737%;
    transform: translate(1500px, -1500px);
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.mo03_03 {
    width: 54.918%;
    transform: translate(-1500px, 1500px);
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.mo04_slide {
    transform: translate(-1500px, 1500px);
}

.sub_container ul li .inner img.mo04_01 {
    width: 52.7868%;
    z-index: 1;
}

.sub_container ul li .inner img.mo04_02 {
    width: 58.2786%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.mo04_03 {
    width: 45.7377%;
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.mo04_04 {
    width: 58.2786%;
    z-index: 4;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.mo04_05 {
    width: 16.3114%;
    z-index: 5;
    transition-delay: 0.3s;
}


/*design */

.sub_container ul li .inner img.de01_01 {
    width: 58.2786%;
    z-index: 1;
}

.sub_container ul li .inner img.de01_02 {
    width: 77.459%;
    z-index: 2;
    transform: translate(-1500px, -1000px);
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.de01_03 {
    width: 45.5737%;
    z-index: 3;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.de01_04 {
    width: 44.6721%;
    z-index: 3;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.de02_01 {
    width: 68.6065%;
    z-index: 3;
}

.sub_container ul li .inner img.de02_02 {
    width: 81.4754%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.de02_03 {
    width: 69.5081%;
    z-index: 1;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.de02_04 {
    width: 71.6393%;
    z-index: 3;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.de03_01 {
    width: 50%;
}

.sub_container ul li .inner img.de03_02 {
    width: 50%;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.de03_03 {
    width: 100%;
    transition-delay: 0.2s;
}


/* software */

.sub_container ul li .inner img.so01_01 {
    width: 75%;
    z-index: 1;
}

.sub_container ul li .inner img.so01_02 {
    width: 50%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.so01_03 {
    width: 34.2622%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.so01_04 {
    width: 50%;
    z-index: 3;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.so02_01 {
    width: 100%;
}

.sub_container ul li .inner img.so02_02 {
    width: 74.918%;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.so02_03 {
    width: 74.836%;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.so02_04 {
    width: 70.9016%;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.so03_01 {
    width: 100%;
    z-index: 1
}

.sub_container ul li .inner img.so03_02 {
    width: 49.6721%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.so04_01 {
    width: 75%;
    z-index: 1;
}

.sub_container ul li .inner img.so04_02 {
    width: 58.7704%;
    z-index: 2;
    -webkit-animation-duration: 0.8s;
    animation-duration: 0.8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}


/* about */

.sub_container ul li .inner img.ab01_01 {
    width: 50%;
    z-index: 1;
}

.sub_container ul li .inner img.ab01_02 {
    width: 50%;
    z-index: 1;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.ab01_03 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.ab02_01 {
    width: 100%;
}


/* 20200109 추가 shopping */

.shopping_con01 {
    margin-bottom: 150px;
}

.sub_container ul li .inner img.sop01_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.sop01_02 {
    width: 58%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop01_03 {
    width: 66%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.sop02_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.sop02_02 {
    width: 65.9%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop02_03 {
    width: 42.8%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.sop02_04 {
    width: 58%;
    z-index: 2;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.sop02_05 {
    width: 40%;
    z-index: 2;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.sop02_06 {
    width: 51.8%;
    z-index: 2;
    transition-delay: 0.4s;
}

.sub_container ul li .inner img.sop03_01 {
    width: 59.8%;
    z-index: 1;
}

.sub_container ul li .inner img.sop03_02 {
    width: 59.8%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop03_03 {
    width: 40.163934426%;
    z-index: 2;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop04_01 {
    width: 100%;
    z-index: 1;
}

.sub_container ul li .inner img.sop04_02 {
    width: 50%;
    z-index: 1;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop04_03 {
    width: 60.7377%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.sop04_04 {
    width: 100%;
    z-index: 2;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.sop04_05 {
    width: 53.196%;
    z-index: 2;
    transition-delay: 0.4s;
}

.sub_container ul li .inner img.sop04_06 {
    width: 58.77%;
    z-index: 2;
    transition-delay: 0.5s;
}

.sub_container ul li .inner img.sop05_01 {
    width: 67.049%;
    z-index: 2;
}

.sub_container ul li .inner img.sop05_02 {
    width: 45.4%;
    z-index: 1;
    transition-delay: 0.1s;
}

.sub_container ul li .inner img.sop05_03 {
    width: 45.4%;
    z-index: 2;
    transition-delay: 0.2s;
}

.sub_container ul li .inner img.sop05_04 {
    width: 45.4%;
    z-index: 3;
    transition-delay: 0.3s;
}

.sub_container ul li .inner img.on {
    transform: translate(0, 0);
}

#member {
    padding: 3% 2%;
}

@media all and (max-width:2120px) {
    /* sub_visual */
    .dn2120 {
        display: none;
    }
}

@media all and (max-width:1800px) {}

@media all and (max-width:1450px) {
    /* sub_visual */
    .sub_visual ul li p {
        font-size: 1.8vw;
    }
    .port_tab ul li {
        width: 14.28%;
    }
}

@media all and (max-width:1300px) {
    /* 서브타이틀 */
    .sub h4 {
        font-size: 35px;
    }
    .sub h5 {
        font-size: 48px;
    }
    .sub_new h4 {
        font-size: 50px;
    }
    .sub .sub_text {
        font-size: 17px;
    }
    .sub .sub_text p {
        font-size: 16px;
    }
    .sub_new .sub_text {
        font-size: 17px
    }
    .sub_new .sub_text p {
        font-size: 16px;
    }
    /* sub_container */
    .sub_container ul li.textPart span {
        font-size: 15px;
    }
    .sub_container ul li.textPart h3 {
        font-size: 70px;
    }
    .sub_container ul li.textPart h3.long {
        font-size: 70px;
    }
    .sub_container ul li.textPart p {
        font-size: 18px;
    }
    .sub_container ul li.textPart br {
        display: none;
    }
    .sub_container ul li.textPart .last {
        font-size: 16px;
    }
    .website_con02 ul li p {
        font-size: 26px;
    }
    .software_con02 .inner_box2 h5 {
        font-size: 30px;
    }
    .software_con02 .inner_box2 .soft_stext {
        font-size: 15px;
    }
    .software_con02 .inner_box2 ul li h6 {
        font-size: 15px;
    }
    .software_con02 .inner_box2 ul li p {
        font-size: 14px;
    }
    .software_con02 .inner_box2 a {
        font-size: 14px;
        width: 13%;
    }
    .software_con02 .inner_box2 a i {
        font-size: 17px;
    }
    .contact_con01 h4 {
        margin-bottom: 50px;
        font-size: 35px;
    }
    .contact_con01 ul li p {
        float: left;
        width: 11vw;
        line-height: 60px;
        font-size: 18px;
    }
    .contact_con01 ul li>div {
        width: calc(100% - 11vw);
    }
    .contact_con01 ul li>div input {
        height: 60px;
        font-size: 14px;
    }
    .contact_con01 textarea {
        height: 600px;
        font-size: 14px;
    }
    .contact_con01 .agree_wrap input {
        width: 15px;
        height: 15px;
        font-size: 14px;
    }
    .contact_con01 .agree_wrap label {
        font-size: 16px;
    }
    .contact_con01 .agree_wrap a {
        font-size: 14px;
    }
    .contact_con01 .btn a {
        font-size: 20px;
    }
    .contact_con01 .btnCuzDuplBootrap a {
        font-size: 20px;
    }
    .port_tab ul li {
        width: 25%;
        font-size: 12px;
    }
    .port_tab ul li:nth-of-type(5) {
        border-top: 0;
        border-left: 1px solid #d6d6d6;
    }
    .port_tab ul li:nth-of-type(6) {
        border-top: 0;
    }
    .port_tab ul li:nth-of-type(7) {
        border-top: 0;
    }
}


/* 모바일 */

@media all and (max-width:999px) {
    /* sub_visual */
    .sub_visual {
        margin-bottom: 12%;
        padding-top: 15.5155155155vw;
        padding-bottom: 10.5105105105vw
    }
    .sub_visual ul {
        display: block;
    }
    .sub_visual ul li {
        display: block;
        width: 100%;
    }
    .sub_visual ul li:first-child {
        padding: 10% 2%;
        overflow: hidden;
        box-sizing: border-box;
    }
    .sub_visual ul li p {
        margin-top: 6%;
        font-size: 5vw;
        padding-right: 3%;
    }
    /* sub_container */
    .sub_container ul li {
        float: none;
        width: 100%;
    }
    .sub_container.rightType ul li {
        float: none;
    }
    .sub_container ul li.textPart {
        padding: 10% 4%;
    }
    .sub_container ul li.textPart h3 {
        font-size: 60px;
    }
    .sub_container ul li.textPart h3.long {
        font-size: 51px;
    }
    .sub_container ul li.textPart h3.pdl {
        font-size: 57px;
    }
    .sub h4 {
        letter-spacing: -0.07em;
    }
    .sub .sub_text {
        margin-bottom: 5%;
        word-break: keep-all;
    }
    .sub .sub_text p {
        margin-top: 1.2%;
    }
    /* homepage */
    .website_con01 {
        margin-bottom: 15%;
    }
    .website_con02 {
        margin-bottom: 15%;
    }
    .website_con03 {
        margin-bottom: 15%;
    }
    .website_con02 ul li {
        position: relative;
        float: none;
        width: 100%;
    }
    .inner_type .container01 {
        margin-bottom: 10%;
    }
    /* mobile */
    .mobile_con01 {
        margin-bottom: 15%;
    }
    .mobile_con02 {
        margin-bottom: 15%;
    }
    .mobile_con02 ul li {
        float: none;
        width: 100%;
    }
    .mobile_con02 ul li .text_t {
        top: 5%;
    }
    .mobile_con02 ul li .text_t h6 {
        font-size: 40px;
    }
    .mobile_con02 ul li .text_t p {
        font-size: 36px;
    }
    .mobile_con02 ul li .text_t span {
        font-size: 28px;
    }
    .container02 ul li {
        width: 50%;
    }
    /* software */
    .software_con01 {
        margin-bottom: 15%;
    }
    .software_con02 {
        margin-bottom: 15%;
    }
    .software_con02 .inner_box2 {
        padding: 10% 0;
    }
    .software_con02 .inner_box2 h5 {
        font-size: 27px;
        text-align: center;
        letter-spacing: -0.025em;
    }
    .software_con02 .inner_box2 h5 img {
        width: 10vw
    }
    .software_con02 .inner_box2 .soft_stext {
        margin: 3% 1% 10%;
    }
    .software_con02 .inner_box2 ul li {
        width: 42%;
    }
    .software_con02 .inner_box2 ul li h6 {
        margin-bottom: 4%;
    }
    .software_con02 .inner_box2 ul li p {
        margin-top: 5%;
        letter-spacing: -0.07em;
        word-break: keep-all;
    }
    .software_con02 .inner_box2 a {
        padding: 2% 0;
        width: 22%;
    }
    /* portfolio */
    .port_tab {
        margin: 5% 0 13%;
        padding: 0;
    }
    .port_tab ul {
        overflow: hidden;
    }
    .port_tab ul li {
        display: block;
        float: left;
        width: 16.666%;
        padding: 2% 0;
        font-size: 12px;
    }
    .port_tab ul li.on {
        border-color: transparent;
    }
    .port_tab ul li:nth-of-type(4) {
        border-top: 1px solid #d6d6d6;
        border-left: 0;
    }
    .port_tab ul li:nth-of-type(5) {
        border-top: 1px solid #d6d6d6;
    }
    .port_tab ul li:nth-of-type(6) {
        border-top: 1px solid #d6d6d6;
    }
    /* portfolio */
    .port_tab {
        margin: 6% 0 5%;
        padding: 0;
    }
    .port_tab ul {
        overflow: hidden;
        font-size: 0;
        text-align: center;
    }
    .port_tab ul li {
        display: inline-block;
        width: 33.333%;
        height: auto;
        padding: 1.8% 1%;
        vertical-align: top;
    }
    .port_tab ul li img {
        width: 63%;
    }
    .sub_visual.port_type>ul>li:first-child {
        padding: 13% 2%;
        overflow: hidden;
        box-sizing: border-box;
    }
    /**/
    /* contact */
    .contact ul li:first-child {
        padding: 10% 2%;
        width: 100%;
    }
    .contact ul li:last-child {
        width: 100%;
    }
    .contact ul li:first-child dl {
        width: 89%;
        padding-right: 0;
    }
    .contact ul li:first-child dl dd {
        font-size: 4.8vw;
        line-height: 1.5;
    }
    .contact ul li:first-child dl dt {
        width: 6%;
        margin: 0 2% 0 0;
    }
    .contact ul li:first-child dl dd a {
        font-size: 5vw;
    }
    .contact ul li:first-child dl dd a.num {
        font-size: 5.625vw;
    }
    .contact ul li:first-child dl>span {
        display: block;
    }
    .contact_con01 {
        padding: 9% 2% 12%;
        margin-bottom: 15%;
    }
    .contact_con01 h4 {
        margin-bottom: 10%;
    }
    .contact_con01 ul li {
        margin-bottom: 4%;
    }
    .contact_con01 ul li.half {
        width: 100%;
    }
    .contact_con01 ul li p {
        width: 28%;
        line-height: 45px;
        font-size: 16px;
    }
    .contact_con01 ul li.no02 p {
        padding-left: 0;
    }
    .contact_con01 ul li>div {
        float: left;
        width: calc(100% - 28%);
    }
    .contact_con01 ul li>div input {
        height: 45px;
    }
    .contact_con01 textarea {
        resize: none;
        width: 100%;
        height: 400px;
        padding: 15px;
        box-sizing: border-box;
        border: 1px solid #d5d3d3;
    }
    .contact_con01 .agree_wrap {
        padding: 4% 0;
    }
    .contact_con01 .agree_wrap input {
        width: 14px;
        height: 14px;
    }
    .contact_con01 .agree_wrap label {}
    .contact_con01 .agree_wrap a {
        padding: 2% 0;
        width: 22%;
    }
    .contact_con01 .btn a {
        display: block;
        margin: 8% auto 0;
        padding: 2% 0;
        width: 30%;
    }
    .contact_con01 .btnCuzDuplBootrap a {
        display: block;
        margin: 8% auto 0;
        padding: 2% 0;
        width: 30%;
    }
    .shopping_con01 {
        margin-bottom: 5.015vw;
    }
}

@media all and (max-width:640px) {
    .software_con02 .inner_box2 ul li {
        width: 96%;
    }
}

@media all and (max-width:600px) {
    .port_tab ul {
        border-top: 1px solid #d6d6d6;
    }
    .port_tab ul li {
        width: 33.333%;
        height: 27.5vw;
        font-size: 12px;
        border-top: 0;
    }
    .port_tab ul li:nth-of-type(4) {
        border-top: 0;
        border-left: 1px solid #d6d6d6;
    }
    .port_tab ul li:nth-of-type(5) {
        border-top: 0;
    }
    .port_tab ul li:nth-of-type(6) {
        border-top: 0;
    }
    .port_tab ul li img {
        margin: 0 auto 5%;
    }
    .container02 ul li {
        width: 100%;
    }
}

@media all and (max-width:550px) {
    .sub h4 {
        font-size: 27px;
    }
    .sub h5 {
        font-size: 32px;
    }
    .sub_new h4 {
        font-size: 44px;
    }
    .website_con02 ul li p {
        font-size: 22px;
    }
    .mobile_con02 ul li .text_t h6 {
        font-size: 24px;
    }
    .mobile_con02 ul li .text_t p {
        position: relative;
        top: 0;
        margin-top: 11%;
        font-size: 16px;
    }
    .mobile_con02 ul li .text_t span {
        font-size: 14px;
    }
    .software_con02 .inner_box2 ul li p {
        font-size: 12px;
    }
    .software_con02 .inner_box2 a {
        padding: 4% 0;
        width: 35%;
    }
    .contact_con01 .btn a {
        padding: 4% 0;
        width: 45%;
    }
    .contact_con01 .btnCuzDuplBootrap a {
        padding: 4% 0;
        width: 45%;
    }
}

@media all and (max-width:330px) {
    .sub_container ul li.textPart h3 {
        font-size: 54px;
        letter-spacing: -0.1em;
    }
}


/* vizen2014  에서 가져옴 시작 **/

.mb7 {
    margin-bottom: 7px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.mb24 {
    margin-bottom: 24px !important;
}

.mb25 {
    margin-bottom: 25px !important;
}

.mb27 {
    margin-bottom: 27px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mb35 {
    margin-bottom: 35px !important;
}

.mb38 {
    margin-bottom: 38px !important;
}

.mb40 {
    margin-bottom: 40px !important;
}

.mb42 {
    margin-bottom: 42px !important;
}

.mb45 {
    margin-bottom: 45px !important;
}

.mb48 {
    margin-bottom: 48px !important;
}

.mb50 {
    margin-bottom: 50px !important;
}

.mb60 {
    margin-bottom: 60px !important;
}

.mb65 {
    margin-bottom: 65px !important;
}

.mb80 {
    margin-bottom: 80px !important;
}

.mappt400 {
    padding-top: 400px !important;
}

.pb50 {
    padding-bottom: 50px !important
}


/*정렬*/

.tc {
    text-align: center;
}

.tl {
    text-align: left !important;
}

.tr {
    text-align: right !important;
}

.font15 {
    font-size: 15px;
}

.font17 {
    font-size: 17px;
}

.font18 {
    font-size: 18px;
    letter-spacing: -0.4px;
}

.font20 {
    font-size: 20px;
    letter-spacing: -0.4px;
}

.font22 {
    font-size: 22px;
    letter-spacing: -1px;
}

.font30 {
    font-size: 30px;
    letter-spacing: -1px;
}


/*버튼*/

.btnZone {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.btnZone .btnLeft {
    float: left;
}

.btnZone .btnRight {
    float: right;
}

.btnZone.bottom {
    margin-bottom: 100px;
}

.btnZone.bottom .btnLeft {
    width: 4.875%;
}

.btnZone.bottom .right_wrap {
    position: absolute;
    right: 0;
    top: 0;
    width: 9.75%;
    font-size: 0;
    text-align: right;
}

.btnZone.bottom .right_wrap a {
    display: inline-block;
    width: 50%;
}


/*버튼 센터 */

.more_btn {
    text-align: center;
    margin-top: 20px;
}

.btnC {
    position: relative;
    text-align: center;
    padding: 0 0;
    clear: both;
    width: 100%;
    vertical-align: middle;
}

.btnC span {
    display: inline-block;
    vertical-align: top;
    margin: 10px 0;
}

#bbs .btnC .btnAll {
    width: 98%;
    margin: 0 1px;
    text-align: center;
    vertical-align: middle;
}


/*포트폴리오Read*/

.portfolioRead {
    position: relative;
    max-width: 1600px;
    margin: 0 auto;
}

.portfolioRead img {
    width: 100%;
}

.portfolioRead .topZone {
    position: relative;
    width: 100%;
    margin: 0 0 60px 0;
}

.portfolioRead .topZone dl {
    text-align: center;
}

.portfolioRead .topZone dl dt {
    font-size: 1.875vw;
    color: #333333;
    padding: 0 9.75% 0 4.875%;
    letter-spacing: -1px;
}

.portfolioRead .topZone dl dd {
    font-size: 1.09375vw;
    color: #86888b;
    padding: 0 9.75% 0 4.875%;
}

.portfolioRead .topZone .list_btn {
    position: absolute;
    left: 0;
    top: 0;
    width: 4.875%;
}

.portfolioRead .topZone .list_control_btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 9.75%;
    font-size: 0;
    text-align: right;
}

.portfolioRead .topZone .list_control_btn a {
    display: inline-block;
    width: 50%;
}

.portfolioRead .detail {
    margin: 0 0 48px 0;
    padding: 0 0 46px 0;
    border-bottom: 1px solid #dedede;
}

.portfolioRead .detail ul {
    overflow: hidden;
    margin: 0 0 57px 0;
}

.portfolioRead .detail ul li {
    float: left;
    margin: 0 12px 0 0;
    padding: 0 0 0 12px;
    background: url(/img/portfolioRead_bar.gif) no-repeat left center;
}

.portfolioRead .detail ul li.first {
    padding-left: 0;
    background: none;
}

.portfolioRead .detail ul li a {
    color: #656565;
}


/*공지사항*/

.noticList ul li {
    clear: both;
    width: calc(100% - 20px);
    min-height: 80px;
    margin: 0 10px 10px;
    padding: 0 0 10px;
    border-bottom: 1px solid #e2e2e2;
}

.noticList a.bgA {
    display: block;
    width: 100%;
    min-height: 90px;
    background: url('/img/noticList_off.gif') no-repeat center right;
}

.info_div1 ul.ul_prt_parent>li>a {
    display: block;
    overflow: hidden;
}

.noticList ul li span.num {
    float: left;
    display: block;
    height: 80px;
    line-height: 80px;
    color: #bdbdbd;
    font-size: 47px;
    font-style: oblique;
    text-align: center;
    letter-spacing: -1px;
    margin-right: 30px;
}


/* .noticList ul li span.num span.day{display:block; color:#bdbdbd; font-size:13px; font-style:normal; margin-top:-8px;} */

.noticList ul li .noticList_txtWrap {
    float: left;
    margin-top: 10px;
}

.noticList ul li span.day {
    display: block;
    color: #bdbdbd;
    font-size: 22px;
    font-style: normal;
    margin-top: 10px;
}

.noticList ul li span.subject {
    display: block;
    width: 100%;
    height: 35px;
    font-size: 22px;
    color: #777;
    line-height: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.noticList ul li .noticList_txtWrap02 {
    width: calc(100% - 140px);
    height: 80px;
    line-height: 80px;
    overflow: hidden;
    margin-top: 0;
}

.noticList ul li .noticList_txtWrap02>span {
    display: inline-block;
}

.noticList ul li .noticList_txtWrap02 span.subject {
    width: calc(100% - 155px);
    height: 80px;
    line-height: 80px;
}

.noticList ul li .noticList_txtWrap02 span.day {
    float: right;
    line-height: 80px;
    width: 140px;
    margin-left: 10px;
    text-align: right;
    margin-top: 0;
}

.noticList ul .current {
    background: #fff;
    width: 100%;
    box-sizing: border-box;
    font-size: 115%;
    color: #666;
    padding: 2%;
}

.noticList.no_edit_text .current * {
    font-size: 18px !important;
    line-height: 1.5 !important;
    font-family: "Noto Sans KR", sans-serif !important;
    color: #444 !important;
}

.noticList ul li.active>a.bgA {
    background: url('/img/noticList_on.gif') no-repeat center right;
}

.noticList ul li.active span.num {
    color: #000000;
}

.noticList ul li.active span.num span.day {
    color: #000000;
}

.noticList ul li.active span.subject {
    color: #000000;
}

.noticList img {
    max-width: 100%;
}


/* vizen2014  에서 가져옴 끝 */

@media all and (max-width:1300px) {
    .portfolioRead .topZone dl dt {
        font-size: 24px;
        word-break: keep-all;
    }
    .portfolioRead .topZone dl dd {
        font-size: 14px;
    }
}

@media all and (max-width:999px) {
    .btnZone.bottom .btnLeft {
        width: 10%;
    }
    .btnZone.bottom .right_wrap {
        width: 20%;
    }
    .portfolioRead .topZone dl dt {
        padding: 0 20% 0 10%;
    }
    .portfolioRead .topZone dl dd {
        padding: 0 20% 0 10%;
    }
    .portfolioRead .topZone .list_btn {
        width: 10%;
    }
    .portfolioRead .topZone .list_control_btn {
        width: 20%;
    }
    .portfolioRead .detail ul li a {
        font-size: 13px;
    }
    .portfolioRead .detail ul li {
        padding: 0;
    }
    .noticList ul li {
        clear: both;
        width: 100%;
        min-height: 50px;
        margin: 0 0 0;
        padding: 0 0 10px;
    }
    .noticList ul li span.num {
        height: 50px;
        line-height: 50px;
        color: #bdbdbd;
        font-size: 14px;
        font-style: oblique;
        text-align: center;
        letter-spacing: -1px;
        margin-right: 10px;
    }
    .noticList ul li .noticList_txtWrap {
        float: left;
        margin-top: 10px;
    }
    .noticList ul li span.day {
        display: block;
        color: #bdbdbd;
        font-size: 13px;
        font-style: normal;
        margin-top: 10px;
    }
    .noticList ul li span.subject {
        height: 35px;
        font-size: 14px;
        color: #777;
        line-height: 35px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .noticList ul li .noticList_txtWrap02 {
        width: calc(100% - 40px);
        height: 50px;
        line-height: 50px;
        overflow: hidden;
        margin-top: 0;
    }
    .noticList ul li .noticList_txtWrap02>span {
        display: inline-block;
    }
    .noticList ul li .noticList_txtWrap02 span.subject {
        width: calc(100% - 95px);
        height: 50px;
        line-height: 50px;
    }
    .noticList ul li .noticList_txtWrap02 span.day {
        float: right;
        line-height: 50px;
        width: 70px;
        margin-left: 10px;
        text-align: right;
        margin-top: 0;
    }
    .noticList ul .current {
        width: 94%;
        font-size: 115%;
        color: #666;
        padding: 2%;
    }
    .noticList.no_edit_text .current * {
        font-size: 12px !Important
    }
    .noticList ul li.active>a.bgA {
        background: url('/img/noticList_on.gif') no-repeat center right;
    }
    .noticList ul li.active span.num {
        color: #000000;
    }
    .noticList ul li.active span.num span.day {
        color: #000000;
    }
    .noticList ul li.active span.subject {
        color: #000000;
    }
    .noticList img {
        max-width: 100%;
    }
    .btnOver>a {
        display: inline-block;
        margin-top: 3%;
        width: 26%;
    }
    .btnOver>a>img {
        width: 100%;
    }
}

.visual_toptop {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2
}

.visual_toptop img {
    width: 100%;
}

@media all and (max-width:1620px) {
    .w1620hidden {
        display: none
    }
}


/* portfolio 페이지 상단 동적 효과 */


/* 동적효과 */

.sub_popo {
    padding: 0;
    position: relative;
    padding-top: 275px;
}

.sub_popo ul li {
    position: relative;
}

.sub_popo ul li .inner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.inner img.t0l0 {
    top: 0;
    left: 0;
}

.inner img.t0r0 {
    top: 0;
    right: 0;
}

.inner img.b0l0 {
    bottom: 0;
    left: 0;
}

.inner img.b0r0 {
    bottom: 0;
    right: 0;
}

.inner img.upside {
    transform: translate(0, -2000px);
    -webkit-transform: translate(0, -2000px);
    -moz-transform: translate(0, -2000px);
    -o-transform: translate(0, -2000px);
}

.inner img.under {
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px);
    -moz-transform: translate(0, 1000px);
    -o-transform: translate(0, 1000px);
}

.inner img.leftside {
    transform: translate(-2000px, 0);
    -webkit-transform: translate(-2000px, 0);
    -moz-transform: translate(-2000px, 0);
    -o-transform: translate(-2000px, 0);
}

.inner img.rightside {
    transform: translate(1800px, 0);
    -webkit-transform: translate(1800px, 0);
    -moz-transform: translate(1800px, 0);
    -o-transform: translate(1800px, 0);
}

.inner img.sidelt {
    transform: translate(-1000px, -1000px);
    -webkit-transform: translate(-1000px, -1000px);
    -moz-transform: translate(-1000px, -1000px);
    -o-transform: translate(-1000px, -1000px);
}

.inner img.sidert {
    transform: translate(500px, -1500px);
    -webkit-transform: translate(500px, -1500px);
    -moz-transform: translate(500px, -1500px);
    -o-transform: translate(500px, -1500px);
}

.inner img.siderb {
    transform: translate(1500px, 1000px);
    -webkit-transform: translate(1500px, 1000px);
    -moz-transform: translate(1500px, 1000px);
    -o-transform: translate(1500px, 1000px);
    -ms-transform: translate(1500px, 1000px);
}

.inner img.sidelb {
    transform: translate(-1000px, 500px);
    -webkit-transform: translate(-1000px, 500px);
    -moz-transform: translate(-1000px, 500px);
    -o-transform: translate(-1000px, 500px);
}

@media all and (min-width:2000px) {
    .inner img.under {
        transform: translate(0, 2000px);
        -webkit-transform: translate(0, 2000px);
        -moz-transform: translate(0, 2000px);
        -o-transform: translate(0, 2000px);
    }
}


/* sub_visual */

.sub_popo {
    overflow: hidden
}

.sub_popo ul {
    position: relative;
    width: 100%;
    vertical-align: middle;
    margin-bottom: 0;
    padding-bottom: 100px;
}

.sub_popo>ul>li {
    position: relative;
    float: left;
    width: 50%;
    vertical-align: middle;
    box-sizing: border-box;
    z-index: 2;
    box-sizing: border-box;
}

.sub_popo>ul>li:first-child {
    padding: 5.6% 0 0 5.5078125%;
    padding-left: 1.15%
}

.sub_popo>ul>li img.st00_mb {
    margin-bottom: 1.5%;
}

.sub_popo ul li .ihide {
    position: relative;
    z-index: -1;
}

.sub_popo ul li h3 {
    font-size: 2.5vw;
    color: #fff;
    letter-spacing: -0.1em;
}

.sub_popo ul li p {
    box-sizing: border-box;
    word-break: keep-all;
    letter-spacing: -0.05em;
    color: #fff;
    font-weight: 300;
}

.sub_popo ul li p strong {
    text-decoration: underline;
}

.trans {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.sub_popo ul li p span.under {
    text-decoration: underline;
}

.sub_popo ul li p span.po01 {
    color: #04fee4;
}

.sub_popo ul li p span.po02 {
    color: #e41957;
    font-weight: 700;
}

.sub_popo ul li p span.po03 {
    color: #f9fc03;
    font-weight: 700;
}

.sub_popo ul li p span.po04 {
    color: #ffeb11;
}

.sub_popo ul li p span.po05 {
    color: #bbff03;
}

.sub_popo>ul>li.inimg {
    display: block;
    float: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.sub_popo>ul>li.inimg .po_inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.sub_popo>ul>li.inimg .de_inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/*homepage*/

.sub_popo ul li .inner img {
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.sub_popo ul li img.hoarrow {
    width: 6.953125%;
    display: none;
}

.sub_popo ul li img.no01 {
    left: 23.59375%;
}

.sub_popo ul li img.no02 {
    left: 23.59375%;
    top: 20.3985932005%;
}

.sub_popo ul li img.no03 {
    left: 30.546875%;
    top: 13.0487%;
}

.sub_popo ul li img.no04 {
    left: 37.5%;
    top: 6%;
}

.sub_popo ul li img.no05 {
    left: 23.59375%;
    top: 41%;
}

.sub_popo ul li img.no06 {
    left: 30.5%;
    top: 33.5329341317%;
}

.sub_popo ul li img.no07 {
    left: 37%;
    top: 26%;
}

.sub_popo ul li img.no08 {
    left: 43.8%;
    top: 19%;
}

.sub_popo ul li img.no09 {
    left: 50.5%;
    top: 12%;
}

.sub_popo ul li img.no10 {
    left: 23.59375%;
    top: 62%;
}

.sub_popo ul li img.no11 {
    left: 30.5%;
    top: 54.5%;
}

.sub_popo ul li img.no12 {
    left: 37.2%;
    top: 47%;
}

.sub_popo ul li img.no13 {
    left: 44%;
    top: 39.5%;
}

.sub_popo ul li img.no14 {
    left: 50.7%;
    top: 32%;
}

.sub_popo ul li img.no15 {
    left: 57.5%;
    top: 24.8%;
}

.sub_popo ul li img.no16 {
    left: 64.5%;
    top: 18%;
}

.sub_popo ul li img.no17 {
    left: 23.59375%;
    top: 83%;
}

.sub_popo ul li img.no18 {
    left: 30.5%;
    top: 76%;
}

.sub_popo ul li img.no19 {
    left: 37%;
    top: 68%;
}

.sub_popo ul li img.no20 {
    left: 43.8%;
    top: 60%;
}

.sub_popo ul li img.no21 {
    left: 50.5%;
    top: 52.5%;
}

.sub_popo ul li img.no22 {
    left: 57%;
    top: 45%;
}

.sub_popo ul li img.no23 {
    left: 64%;
    top: 38%;
}

.sub_popo ul li img.no24 {
    left: 71%;
    top: 30.5%;
}

.sub_popo ul li img.no25 {
    left: 77.5%;
    top: 23.5%;
}

.sub_popo ul li img.no26 {
    left: 50.5%;
    top: 74%;
}

.sub_popo ul li img.no27 {
    left: 57.2%;
    top: 66.5%;
}

.sub_popo ul li img.no28 {
    left: 64%;
    top: 59%;
}

.sub_popo ul li img.no29 {
    left: 57.2%;
    top: 88%;
}

.sub_popo ul li img.no30 {
    left: 64%;
    top: 81%;
}

.sub_popo ul li img.no31 {
    left: 71%;
    top: 73%;
}

.sub_popo ul li img.no32 {
    left: 71%;
    top: 95%;
}

.sub_popo ul li img.no33 {
    left: 78.5%;
    top: 88%;
}

.sub_popo>ul>li.inimg .port_b {
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
}

.sub_popo>ul>li.inimg .po_inner img {
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    transform: translate(1500px, 1500px);
    -webkit-transform: translate(1500px, 1500px);
    -moz-transform: translate(1500px, 1500px);
    -o-transform: translate(1500px, 1500px);
}

.sub_popo>ul>li.inimg .po_inner .po_i01 {
    width: 23.906%;
    top: -1.5%;
    right: 30.5%;
}

.sub_popo>ul>li.inimg .po_inner .po_i02 {
    width: 23.906%;
    bottom: -32%;
    right: 29%;
    transition-delay: 0.1s;
}

.sub_popo>ul>li.inimg .po_inner .po_i03 {
    width: 23.906%;
    bottom: -25%;
    right: 13%;
    transition-delay: 0.2s;
}

.sub_popo>ul>li.inimg .po_inner .po_i04 {
    width: 23.906%;
    top: -4%;
    right: 13%;
    transition-delay: 0.2s;
}

.sub_popo>ul>li.inimg .po_inner .po_i05 {
    width: 23.906%;
    bottom: -23%;
    right: -4.5%;
    transition-delay: 0.2s;
}

.sub_popo>ul>li.inimg .po_inner .po_i06 {
    width: 23.906%;
    bottom: 43%;
    right: -1%;
    transition-delay: 0.3s;
}

.sub_popo>ul>li.inimg .po_inner .po_i07 {
    width: 23.906%;
    bottom: -9%;
    right: -18.3%;
    transition-delay: 0.3s;
}

.sub_popo>ul>li.inimg .po_inner .po_i08 {
    width: 23.906%;
    top: -52.5%;
    right: -7.5%;
    transition-delay: 0.3s;
}

.sub_popo>ul>li.inimg.on .po_inner img {
    transform: translate(0, 0);
}

@media all and (max-width:1920px) {
    .sub_popo>ul>li.inimg .po_inner .po_i01 {
        top: 3.5%;
        right: 29.5%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i02 {
        bottom: -32%;
        right: 28%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i03 {
        bottom: -25%;
        right: 12%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i04 {
        top: 1%;
        right: 11.7%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i05 {
        bottom: -23%;
        right: -6%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i06 {
        bottom: 46%;
        right: -1%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i07 {
        bottom: -6%;
        right: -19.3%;
    }
    .sub_popo>ul>li.inimg .po_inner .po_i08 {
        top: -52.5%;
        right: -7.5%;
    }
}

@media all and (max-width:999px) {
    /* sub_visual */
    .sub_popo {
        padding-top: 15.5155155155vw;
    }
    .sub_popo ul {
        display: block;
        padding-bottom: 0;
    }
    .sub_popo>ul>li {
        display: block;
        width: 100%;
        float: none;
    }
    .sub_popo>ul>li:first-child {
        padding: 13% 2%;
        overflow: hidden;
        box-sizing: border-box;
    }
    .sub_popo ul li h3 {
        font-size: 6vw;
    }
    .sub_popo ul li p {
        font-size: 5vw;
    }
    .inner_type {
        padding-top: 9%;
    }
    #wrap.momain {
        background-size: 340% auto;
    }
    .homain .sub_popo {
        padding-top: 100px;
    }
    .port_type {
        padding-top: 100px;
    }
    .abmain .sub_popo {
        margin: -130px 0 13%;
        background: #131a20 url(/img/ab_tit.jpg) no-repeat 76% bottom;
        background-size: auto 60%;
        padding-top: 100px;
    }
    .comain .sub_popo {
        margin: -130px 0 13%;
        padding-top: 100px;
        background: #674fff url(/img/con_titbg.jpg) no-repeat 75% bottom;
        background-size: 235% auto;
    }
    .demain .sub_popo {
        margin: -130px 0 13%;
        padding-top: 100px;
    }
    .momain .sub_popo {
        margin: -130px 0 0;
        padding-top: 100px;
        background-size: auto 100%;
    }
    .sub_popo>ul>li.inimg {
        bottom: 0;
        top: auto;
    }
    #wrap02 .sub_popo>ul>li.inimg img.cont_tit {
        width: 200%;
        max-width: 1500%;
        bottom: 0;
        top: auto;
        right: -25%;
    }
    .sub_popo>ul>li.inimg.po_wrap {
        height: 55%;
    }
    .sub_popo>ul>li.inimg .po_inner {
        width: 200%;
        height: 100%;
        bottom: 0;
        left: auto;
        right: -10%;
    }
    .sub_popo>ul>li.inimg .de_inner {
        width: 170%;
        height: 78%;
        margin-top: 14.5%;
        bottom: 0;
        left: auto;
        right: -6.5%;
    }
}


/* ------ sub_container_text ------ */

.sub_container_text {
    margin: 60px 0;
}

.sub_container_text ul {
    font-size: 0;
    letter-spacing: -4px;
}

.sub_container_text ul li {
    text-align: center;
    padding: 40px 30px;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    width: calc(25% - 15px);
    margin-right: 20px;
    border: 1px solid #eee;
    min-height: 356px;
    background: #fff;
    box-sizing: border-box;
}

.demain .sub_container_text ul li {
    padding: 60px 30px;
}

.sub_container_text ul li:last-child {
    margin-right: 0;
}

.sub_container_text ul li i {
    display: inline-block;
    vertical-align: top;
}

.sub_container_text ul li h5 {
    font-size: 24px;
    color: #222;
    letter-spacing: -0.05em;
    font-weight: bold;
    margin: 0;
}

.sub_container_text ul li p {
    font-size: 20px;
    color: #222;
    letter-spacing: -0.05em;
    font-weight: 300;
    margin-bottom: 14px;
}

.sub_container_text ul li span {
    font-size: 20px;
    color: #979797;
    letter-spacing: -0.045em;
    font-weight: 200;
    word-break: keep-all;
}

.sub_container_text ul li span b {
    font-weight: 400;
    color: #797979;
    display: block;
}

.sub_container_text.type02 ul li {
    width: calc(33.333333% - 14px);
    margin-right: 21px;
    margin-bottom: 21px;
    min-height: 495px
}

.sub_container_text.type02 ul li:nth-of-type(3n) {
    margin-right: 0;
}

.sub_container_text.type02 ul li p {
    margin-bottom: 25px;
}

.sub_container_text.type02 ul li span {
    font-size: 18px;
}

.sub_container_text.type02 ul li span b {
    margin-bottom: 30px
}

@media all and (max-width:1920px) {
    .sub_container_text ul li span br {
        display: none;
    }
}

@media all and (max-width:1300px) {
    .sub_container_text ul li {
        width: calc(50% - 20px);
        margin-right: 40px;
        margin-bottom: 40px;
    }
    .sub_container_text ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .sub_container_text.type02 ul li {
        width: calc(50% - 20px);
        margin-right: 40px;
        margin-bottom: 40px;
        min-height: auto
    }
    .sub_container_text.type02 ul li:nth-of-type(3n) {
        margin-right: 40px;
    }
    .sub_container_text.type02 ul li:nth-of-type(2n) {
        margin-right: 0;
    }
}

@media all and (max-width:767px) {
    .sub_container_text ul li {
        width: 100%;
        margin: 15px 0;
        padding: 20px;
        min-height: auto;
    }
    .sub_container_text ul li:nth-of-type(2n) {
        margin: 15px 0
    }
    .sub_container_text ul li:last-child {
        margin: 15px 0
    }
    .sub_container_text ul li h5 {
        font-size: 16px
    }
    .sub_container_text ul li p {
        font-size: 14px
    }
    .sub_container_text ul li span {
        font-size: 14px
    }
    .sub_container_text.type02 ul li {
        width: 100%;
        margin: 15px 0;
    }
    .sub_container_text.type02 ul li:nth-of-type(3n) {
        margin: 15px 0;
    }
    .sub_container_text.type02 ul li:nth-of-type(2n) {
        margin: 15px 0;
    }
    .sub_container_text.type02 ul li p {
        margin-bottom: 20px;
    }
    .sub_container_text.type02 ul li span {
        font-size: 14px;
    }
    .sub_container_text.type02 ul li span b {
        margin-bottom: 20px
    }
}


/* - about - */

.about_con07 {
    padding: 0 60px 160px;
    box-sizing: border-box;
}

.about_con07 ul {
    border: 1px solid #e8e8e8;
    font-size: 0;
    letter-spacing: -4px;
}

.about_con07 ul li {
    width: 25%;
    padding: 60px 0;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    position: relative;
}

.about_con07 ul li:before {
    content: "";
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ebebeb;
    position: absolute;
    display: block;
    right: -7px;
    top: 200px
}

.about_con07 ul li:last-child:before {
    display: none;
}

.about_con07 ul li .round_box {
    width: 324px;
    height: 324px;
    margin: 0 auto;
    border-radius: 50%;
    border: 1px solid #dfdfdf;
    padding: 20px;
    position: relative;
    box-sizing: border-box;
}

.about_con07 ul li .round_box .progress_bar {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.about_con07 ul li .round_box .progress_bar04 {
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
}

.about_con07 ul li .round_box .progress_bar03 {
    transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
}

.about_con07 ul li .round_box .progress_bar02 {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
}

.about_con07 ul li .round_box .progress_bar01 {
    transform: rotate(0);
    -ms-transform: rotate(0);
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    -moz-transform: rotate(0);
}

.about_con07 ul li .round_box .up {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
}

.about_con07 ul li .round_box .up span {
    line-height: 1.1;
    display: block;
    font-size: 32px;
    color: #6700e6;
    letter-spacing: -0.025em;
    font-weight: bold;
}

.about_con07 ul li .round_box .up h5 {
    font-size: 32px;
    margin: 10px 0;
    color: #222;
    letter-spacing: -0.025em;
    font-weight: bold;
}

.about_con07 ul li .round_box .up p {
    font-size: 26px;
    color: #6700e6;
    letter-spacing: -0.025em;
    font-weight: 300;
}

.about_con07 ul li .text {
    padding: 70px 20px 0;
    min-height: 340px;
    box-sizing: border-box;
    position: relative;
}

.about_con07 ul li .text:before {
    content: "";
    width: 1px;
    height: 340px;
    background: #e8e8e8;
    display: block;
    position: absolute;
    right: 0;
    top: 0;
}

.about_con07 ul li:last-child .text:before {
    display: none;
}

.about_con07 ul li .text p {
    font-size: 20px;
    color: #222;
    letter-spacing: -0.05em;
    margin-bottom: 30px;
}

.about_con07 ul li .text span {
    font-size: 20px;
    color: #999;
    font-weight: 300;
    letter-spacing: -0.05em;
}

.about_con07 .bot_btn {
    text-align: center;
    margin-top: 60px;
}

.about_con07 .bot_btn a {
    display: inline-block;
    vertical-align: top;
    padding: 24px 70px;
    background: #6700e6;
    font-size: 32px;
    color: #fff;
    letter-spacing: -0.025em;
}

.about_con07 .bot_btn a img {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    position: relative;
    top: -2px;
}

img.history_bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%
}

.history_box {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: 42.96875vw;
    overflow-y: scroll;
    -ms-overflow-style: none;
}

.history_box::-webkit-scrollbar {
    display: none;
}

.history_page_num {
    position: absolute;
    right: 25px;
    bottom: 20px;
    z-index: 10;
}

.history_page_num ul {
    height: 100%;
}

.history_page_num ul li {
    position: static;
    width: 100%;
    margin: 8px auto;
    float: none;
}

.history_page_num ul li a {
    font-size: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #cbcbcb;
    display: block;
}

.history_page_num ul li a.on {
    background: #370716
}

.history_box .icon_box {
    position: absolute;
    right: 0;
    top: 0;
}

.history_box dl {
    width: 640px;
    margin: 0 auto;
    margin-top: -10px;
    position: relative;
}

.history_box dl dt {
    top: 60px;
    position: absolute;
    width: 170px;
    height: 67px;
    background: #f41156;
    font-size: 36px;
    color: #fff;
    letter-spacing: 0em;
    line-height: 67px;
    text-align: center;
    font-weight: 500;
    border-radius: 5px;
    box-shadow: 6px 12px 9px rgba(0, 0, 0, 0.31);
}

.history_box dl dd {
    padding: 30px 20px;
    box-sizing: border-box;
    position: relative;
}

.history_box dl dd p {
    font-size: 0;
    letter-spacing: -4px;
}

.history_box dl dd p:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden
}

.history_box dl dd p b {
    width: 60px;
    padding: 0 10px;
    font-size: 26px;
    color: #c3c3c3;
    letter-spacing: -0.075em;
    font-weight: bold;
    display: block;
    float: left;
    box-sizing: border-box;
}

.history_box dl dd p span {
    width: calc(100% - 60px);
    font-size: 26px;
    color: #222;
    letter-spacing: -0.075em;
    font-weight: 300;
    display: block;
    float: left;
}

.history_box dl:nth-of-type(1) dd {
    padding-top: 110px
}

.history_box dl:nth-of-type(1) dt {
    top: 120px
}

.history_box dl:nth-of-type(2n-1) dd {
    box-shadow: inset 5px 2px 8px rgba(0, 0, 0, 0.1);
    border-right: 0;
    border-left: 10px solid #fff;
    border-radius: 15px 0 0 15px
}

.history_box dl:nth-of-type(2n-1) dt {
    left: -200px;
}

.history_box dl:nth-of-type(2n) dd {
    box-shadow: inset -5px 14px 8px rgba(0, 0, 0, 0.1);
    border-left: 0;
    border-right: 10px solid #fff;
    border-radius: 0 15px 15px 0
}

.history_box dl:nth-of-type(2n) dt {
    right: -200px;
}

.history_box dl:nth-of-type(2n) dd p b {
    float: right;
}

.history_box dl:nth-of-type(2n) dd p span {
    float: right;
    text-align: right
}

.history_box dl dd:before {
    content: "";
    width: 100%;
    border-top: 10px solid #fff;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
}

.history_box dl dd p {
    margin: 20px 0;
}

@media all and (max-width:2560px) {
    .history_box .icon_box {
        width: 12.890625vw
    }
    .history_box .icon_box img {
        width: 100%
    }
    .history_box dl {
        width: 25vw
    }
    .history_box dl dd {
        padding: 1.171875vw 0.78125vw
    }
    .history_box dl:nth-of-type(1) dd {
        padding-top: 4.296875vw;
    }
    .history_box dl:nth-of-type(2n-1) dd {
        border-width: 0.390625vw;
    }
    .history_box dl:nth-of-type(2n) dd {
        border-width: 0.390625vw
    }
    .history_box dl dt {
        top: -2.34375vw;
        width: 6.640625vw;
        height: 2.6171875vw;
        font-size: 1.40625vw;
        line-height: 2.6171875vw;
    }
    .history_box dl:nth-of-type(1) dt {
        top: 4.6875vw
    }
    .history_box dl:nth-of-type(2n-1) dt {
        left: -7.8125vw;
    }
    .history_box dl:nth-of-type(2n) dt {
        right: -7.8125vw
    }
    .history_box dl dd p {
        margin: 0.78125vw 0;
    }
    .history_box dl dd p b {
        width: 2.34375vw;
        font-size: 1.015625vw;
        padding: 0 0.390625;
    }
    .history_box dl dd p span {
        width: calc(100% - 2.34375vw);
        font-size: 1.015625vw;
    }
}

@media all and (max-width:1600px) {
    .abmain .sub_visual .split_box span.a {
        left: 14vw;
    }
    .abmain .sub_visual .split_box span.b {
        left: 26vw;
    }
    .abmain .sub_visual .split_box span.o {
        left: 6vw;
    }
    .abmain .sub_visual .split_box span.u {
        left: 20vw;
    }
    .abmain .sub_visual .split_box span.t {
        left: 13vw;
    }
    .about_con07 ul li .round_box {
        width: 260px;
        height: 260px;
    }
    .about_con07 ul li .text p br {
        display: none
    }
    .about_con07 ul li .text span br {
        display: none
    }
}

@media all and (max-width:1400px) {
    .about_con07 ul li {
        width: 50%;
    }
    .about_con07 ul li:nth-of-type(2n):before {
        display: none;
    }
    .about_con07 ul li:nth-of-type(2n) .text:before {
        display: none;
    }
}

@media all and (max-width:1000px) {
    .abmain .sub_visual .split_box span.a {
        left: 18vw;
        top: -10px;
    }
    .abmain .sub_visual .split_box span.b {
        left: 73vw;
        top: 20%;
    }
    .abmain .sub_visual .split_box span.o {
        left: 10vw;
        top: 40%;
    }
    .abmain .sub_visual .split_box span.u {
        left: 53vw;
        top: 60%;
    }
    .abmain .sub_visual .split_box span.t {
        left: 33vw;
        bottom: -10px;
    }
    .about_con03 {
        padding-top: 80px !important
    }
    .about_con07 {
        padding: 0 0 80px
    }
    .about_con07 ul li {
        width: 100%;
        display: block;
        padding: 30px;
        box-sizing: border-box;
    }
    .about_con07 ul li .text {
        min-height: auto;
    }
    .about_con07 ul li:before {
        display: none;
    }
    .about_con07 ul li .text:before {
        display: none;
    }
    .history_box {
        height: 80.7vw;
    }
    .history_box .icon_box {
        width: 25vw
    }
    .history_box dl {
        width: 55vw
    }
    .history_box dl dd {
        padding: 3vw 2vw
    }
    .history_box dl:nth-of-type(1) dd {
        padding-top: 11vw;
    }
    .history_box dl:nth-of-type(2n-1) dd {
        border-width: 1vw;
    }
    .history_box dl:nth-of-type(2n) dd {
        border-width: 1vw
    }
    .history_box dl dt {
        z-index: 3;
        top: -3vw;
        width: 17vw;
        height: 6.7vw;
        font-size: 3.6vw;
        line-height: 6.7vw;
    }
    .history_box dl:nth-of-type(1) dt {
        top: 7vw
    }
    .history_box dl:nth-of-type(2n-1) dt {
        left: -14vw;
    }
    .history_box dl:nth-of-type(2n) dt {
        right: -14vw
    }
    .history_box dl dd p {
        margin: 2vw 0;
    }
    .history_box dl dd p b {
        width: 6vw;
        font-size: 2.2vw;
        padding: 0 1vw;
    }
    .history_box dl dd p span {
        width: calc(100% - 6vw);
        font-size: 2.2vw;
    }
}

@media all and (max-width:640px) {
    .about_con07 ul li {
        padding: 30px 10px;
    }
    .about_con07 ul li .round_box {
        width: 230px;
        height: 230px;
    }
    .about_con07 ul li .round_box .up span {
        font-size: 26px
    }
    .about_con07 ul li .round_box .up h5 {
        font-size: 26px
    }
    .about_con07 ul li .round_box .up p {
        font-size: 18px
    }
    .about_con07 ul li .text {
        padding: 40px 20px 0;
    }
    .about_con07 ul li .text p {
        font-size: 16px
    }
    .about_con07 ul li .text span {
        font-size: 16px
    }
    .about_con07 .bot_btn {
        margin-top: 30px
    }
    .about_con07 .bot_btn a {
        padding: 10px 20px;
        font-size: 20px;
    }
    .history_page_num {
        bottom: -10px
    }
    .history_page_num ul li a {
        width: 8px;
        height: 8px;
    }
}

@media all and (max-width:360px) {
    .history_box .icon_box {
        right: -6vw;
        top: -4vw;
    }
    .history_box dl {
        width: 70vw
    }
    .history_box dl:nth-of-type(1) dt {
        top: 4vw
    }
    .history_box dl:nth-of-type(2n-1) dt {
        left: -10vw;
    }
    .history_box dl dt {
        top: -3vw
    }
    .history_box dl:nth-of-type(2n) dt {
        right: -10vw;
    }
}


/*Landing */

.showvisible {
    opacity: 1;
    animation: mymove 1s;
}

@keyframes mymove {
    from {
        transform: translateY(200px);
    }
    to {
        transform: translateY(0);
    }
}

.landing-container {
    max-width: unset;
    padding: 0;
    margin: 0;
}

.first-section {
    width: 100%;
    /* margin-top: 66px; */
    margin-bottom: 5%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.first-section img {
    filter: brightness(0.45);
}

.txt-container {
    font-family: nanumGothic;
    position: absolute;
    top: 40%;
}

.top_txt_underline {
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 1%;
    border-bottom: 2px solid #fff
}

.top_txt_h {
    line-height: 1;
    margin: 0;
}

.top_logo_h,
.top_logo_h2 {
    font-weight: unset;
    padding-bottom: 6.5%;
    line-height: 1;
    margin: 0;
}

.top_logo_h {
    font-size: 4.5vw;
}

.top_logo_h2 {
    font-size: 5vw;
}

.top_txt_h {
    font-size: 3.5vw;
    color: #fff;
    font-weight: 300;
}

.top_logo {
    color: white;
    text-align: center;
}

.top_txt {
    text-align: center;
}

.solve-note {
    margin: auto;
    display: flex;
    justify-content: center;
}

.solve-note img {
    width: 75%;
}

.concept1-img {
    left: 4%;
    bottom: 7%;
    width: 47%;
}

.concept2-img {
    top: 9%;
    left: 34%;
    width: 34%;
}

.concept3-img {
    bottom: 10%;
    right: 4%;
    width: 34%;
}

.concept-img {
    position: absolute;
    transition-delay: 0.2s;
    transition: all 0.5s;
}

.present-img {
    position: absolute;
    transition: all 0.5s;
    transition-delay: 0.1s;
    width: 100%;
}

.teacher-img {
    left: 5%;
    width: 47%;
}

.student-img {
    right: 10%;
    width: 35%;
}

.navbar-container {
    padding: 0 15px;
    display: flex;
    margin-right: unset;
    justify-content: space-between;
}

.header_menu {
    display: flex;
}

.com-present {
    left: 4%;
    top: 15%;
    width: 50%;
}

.tablet-present {
    right: 6%;
    bottom: 10%;
    width: 29%;
}

.mt-5 {
    margin-top: 15px;
}

.mb-2 {
    margin-bottom: 5px;
}