/**********************************************************************************
	FONTS
**********************************************************************************/
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800&display=swap");
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 100;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format("opentype");
}

@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 300;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype");
}

@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 400;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype");
}

@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 500;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format("opentype");
}

@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 700;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format("opentype");
}

@font-face {
    font-family: "Noto Sans KR";
    font-style: normal;
    font-weight: 900;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format("woff2"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format("woff"), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format("opentype");
}

html,
body {
    font-family: "Open Sans", "NanumSquare", AppleGothic, "Dotum", sans-serif;
    color: #777;
    overflow-x: hidden;
}

/*
	normalize / reset
*/
html {
    font-size: 100%;
}
@media (max-width: 767px) {
    html {
        font-size: 87.5%;
    }
}
body {
    line-height: 1;
    position: relative;
}
body * {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
}
ol,
ul {
    list-style: none;
}

p,
ul,
li,
ol,
dl,
dt,
dd,
figure {
    padding: 0;
    margin: 0;
}

a {
    text-decoration: none;
    color: inherit;
}

table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

img {
    vertical-align: middle;
    max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    color: inherit;
    margin: 0;
}

button,
textarea,
input,
select {
    font-family: inherit;
    color: inherit;
    padding: 0;
}

button {
    border: 0;
}

/**********************************************************************************
	[media query examples]
	@media (max-width: 575px) { }
	@media (max-width: 767px) { }
	@media (max-width: 991px) { }
	@media (max-width: 1199px) { }

	--breakpoint-sm: 576px;
	--breakpoint-md: 768px;
	--breakpoint-lg: 992px;
	--breakpoint-xl: 1200px;
**********************************************************************************/
.clear:after {
    display: block;
    clear: both;
    content: "";
}
.container {
    max-width: 1217px;
    margin: 0 auto;
    position: relative;
}

.container-full {
    width: 100%;
    position: relative;
}

@media (max-width: 1217px) {
    .container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width: 600px) {
    #wpadminbar {
        position: fixed;
    }
}

/* Header */
header .nav .nav-icon {
    display: none;
}

header .nav .nav-icon:after,
header .nav .nav-icon:before,
header .nav .nav-icon div {
    background-color: #000;
    content: "";
    display: block;
    height: 2px;
    margin: 5px 0;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
header .nav .nav-icon:before {
    margin-top: 0;
}
header .nav .nav-icon:after {
    margin-bottom: 0;
}
header .nav .nav-icon.active:before {
    transform: translateY(8px) rotate(135deg);
    -moz-transform: translateY(8px) rotate(135deg);
    -webkit-transform: translateY(8px) rotate(135deg);
}
header .nav .nav-icon.active:after {
    transform: translateY(-6px) rotate(-135deg);
    -moz-transform: translateY(-6px) rotate(-135deg);
    -webkit-transform: translateY(-6px) rotate(-135deg);
}
header .nav .nav-icon.active div {
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
}
@media (max-width: 1199px) {
    header .nav .nav-icon {
        display: inline-block;
        width: 24px;
        cursor: pointer;
        position: absolute;
        top: 50%;
        right: 10px;
        z-index: 100;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

    header .nav .navbar {
        position: fixed;
        width: 100%;
        height: 100%;
        right: -100%;
        padding: 60px 20px 40px;
        background: #fff;
        z-index: 99;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        transition: all 0.5s ease;
        margin: 0;
    }

    header .nav .navbar.active {
        right: 0;
    }
}
.headerArea {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
}
.headerArea .container {
    height: 134px;
}
.headerArea .logo {
    /* width: 140px; */
    height: 47px;
    margin-top: -23.5px;
    position: absolute;
    left: 0;
    top: 50%;
}
.headerArea .navbar > li {
    font-family: "Open Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.1px;
    color: #555;
    text-transform: uppercase;
}
.headerArea .navbar > li:last-child {
    margin-right: 0;
}
.headerArea .sitemap-bt {
    width: 22px;
    position: absolute;
    right: 0;
    top: 50%;
    background: transparent;
    transform: translateY(-50%);
    cursor: pointer;
}
.headerArea .sitemap-bt span,
.headerArea .sitemap-bt:before,
.headerArea .sitemap-bt:after {
    display: block;
    width: 22px;
    height: 3px;
    background: #555;
    margin: 4px 0;
}
.headerArea .sitemap-bt:before,
.headerArea .sitemap-bt:after {
    margin: 0;
    content: "";
}
.footer {
    position: relative;
}
.footer .cs-box {
    height: 263px;
    padding-top: 72px;
    margin-top: -72px;
    background: url(../images/footer-cs.png) no-repeat top center;
}
.footer .cs-box .container {
    height: 248px;
    margin-top: -57px;
}
.footer .cs-box p {
    padding-top: 59px;
    font-size: 26px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1.461;
    color: #fff;
}
.footer .cs-box p:before {
    display: block;
    width: 63px;
    height: 2px;
    margin-bottom: 18px;
    background: #fff;
    content: "";
}
.footer .cs-box .bt {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -28px;
}
.footer .site-info {
    padding: 40px 0 50px;
    font-family: "Noto Sans KR";
}
.footer .site-info .info:before {
    display: block;
    width: 21px;
    height: 2px;
    margin-bottom: 12px;
    background: #000;
    content: "";
}
.footer .site-info .info li {
    font-size: 15px;
    letter-spacing: -0.5px;
    line-height: 1.86;
    color: #555;
}
.footer .site-info .info li:first-child {
    font-weight: 700;
    color: #000;
}
.footer .site-info .link {
    padding-bottom: 5px;
    border-bottom: 1px solid #a3a3a3;
    color: #000;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.5px;
    position: absolute;
    right: 0;
    top: 23px;
}
.footer .copyright {
    margin-top: 48px;
    font-family: "Open Sans";
    font-size: 13px;
    color: #000;
    opacity: 0.6;
    text-transform: uppercase;
}
.to-top {
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #000;
    text-transform: uppercase;
    position: absolute;
    right: 25px;
    top: -129px;
    cursor: pointer;
}
.to-top:before {
    display: block;
    width: 2px;
    height: 58px;
    margin: 0 auto 14px;
    background: #000;
    content: "";
}
.site-content {
    padding-top: 134px;
}
@media (min-width: 1200px) {
    .headerArea .navbar {
        text-align: right;
    }
    .headerArea .navbar > li {
        display: inline-block;
        margin-right: 34px;
        line-height: 134px;
    }
    .headerArea .navbar > li:last-child {
        margin-right: 0;
    }
    .headerArea .navbar > li > a {
        transition: 0.3s ease;
    }
    .headerArea .navbar > li.current_page_item a,
    .headerArea .navbar > li.current-page-ancestor a {
        border-bottom: 2px solid #000;
        color: #111;
        padding-bottom: 5px;
    }
    .headerArea .navbar > li:hover > a {
        color: #111;
    }
}
@media (max-width: 1199px) {
    .headerArea .sitemap-bt {
        display: none;
    }
    .headerArea {
        border-width: 2px;
    }
    .headerArea > .container {
        height: 55px;
    }
    .headerArea .navbar > li {
        display: block;
        text-align: left;
        margin: 0;
        border-bottom: 1px solid #ededed;
        font-size: 19px;
        font-weight: 700;
        color: #111;
    }
    .headerArea .navbar > li > a {
        padding: 10px 20px;
        line-height: normal;
        display: block;
        position: relative;
    }
    .headerArea .navbar > li.menu-item-has-children {
        padding-bottom: 0;
    }
    .headerArea .navbar > li.menu-item-has-children > a:before {
        width: 16px;
        height: 9px;
        margin-top: -4.5px;
        position: absolute;
        right: 20px;
        top: 50%;
        background: url(../images/nav-off.png);
        background-size: contain;
        content: "";
    }
    .headerArea .navbar > li .sub-menu {
        display: none;
    }
    .headerArea .navbar > li > .sub-menu {
        padding: 15px 30px 20px 36px;
        background: #f9f9f9;
    }
    .headerArea .navbar > li .sub-menu li {
        font-size: 14px;
        line-height: 36px;
    }
    .headerArea .logo {
        width: 196px;
        height: 28px;
        margin-top: -14px;
        left: 15px;
        z-index: 100;
    }
    .site-content {
        padding-top: 57px;
    }
}
/* Pagination */
.pagination .nav-links {
    text-align: center;
}
.pagination .screen-reader-text {
    display: none;
}
.pagination .page-numbers {
    display: inline-block;
    width: 35px;
    height: 35px;
    vertical-align: top;
    line-height: 33px;
    text-align: center;
    color: #222;
    font-size: 18px;
    font-family: "Roboto";
    color: #888;
    cursor: pointer;
}
.pagination .page-numbers.current,
.pagination .page-numbers.current:hover {
    color: #000;
    font-weight: 700;
}
.pagination .page-numbers:hover {
    color: #000;
}
.pagination .page-numbers.prev,
.pagination .page-numbers.next {
    border: 1px solid rgba(34, 34, 34, 0.2);
    position: relative;
}
.pagination .page-numbers.prev {
    margin-right: 10px;
}
.pagination .page-numbers.next {
    margin-left: 10px;
}
.pagination .page-numbers.prev:before,
.pagination .page-numbers.next:before {
    width: 8px;
    height: 13px;
    background: url(../images/pagination.png) no-repeat;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -6.5px;
    margin-left: -4px;
    content: "";
}
.pagination .page-numbers.prev {
    transform: rotate(180deg);
}
.pagination .page-numbers.prev.disabled,
.pagination .page-numbers.next.disabled {
    cursor: auto;
    pointer-events: none;
}
.pagination .page-numbers.prev.disabled:before,
.pagination .page-numbers.next.disabled:before {
    opacity: 0.2;
}
.mo-ver {
    display: none;
}
@media (max-width: 767px) {
    .pagination .page-numbers {
        font-size: 1rem;
        width: 30px;
        height: 30px;
    }
}

/* Main */
.tit1 {
    font-size: 28px;
    font-family: "NanumSquare", sans-serif;
    font-weight: 700;
    letter-spacing: -1px;
    line-height: 1.07;
}
.txt {
    font-size: 17px;
    line-height: 1.588;
    letter-spacing: -1px;
}
.btn-box {
    text-align: center;
}
.bt {
    display: inline-block;
    min-width: 214px;
    padding: 0 10px;
    height: 56px;
    line-height: 56px;
    text-align: center;
    background: #464646;
    font-family: "NanumSquare";
    font-size: 17px;
    letter-spacing: -1px;
    color: #fff;
    transition: 0.3s ease;
}
.bt.dark:hover {
    background: #fff;
    border: 1px solid #3e3e3e;
    color: #3e3e3e;
}
.bt.light {
    background: transparent;
    color: #fff;
    border: 1px solid #fff;
}
.bt.light:hover {
    background: #fff;
    border-color: #fff;
    color: #3e3e3e;
}
.bt.line {
    border: 1px solid #000;
    color: #000;
    padding: 0 40px;
    background: transparent;
}
.bt.line:hover {
    background: #464646;
    color: #fff;
    border-color: #464646;
}
.main-visual {
    height: 758px;
    position: relative;
    overflow: hidden;
}
.main-visual .swiper-slide:before {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #000;
    opacity: 0.5;
    content: "";
}
.main-visual .swiper-slide {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.main-visual .swiper-slide a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.main-visual p {
    padding-top: 275px;
    font-size: 54px;
    line-height: 1.33;
    letter-spacing: -0.05em;
    color: #fff;
    text-align: center;
}
.main-visual h1 {
    width: 100%;
    font-family: "NanumSquare";
    font-weight: 400;
    font-size: 54px;
    letter-spacing: -2px;
    line-height: 1.333;
    color: #fff;
    text-align: center;
    position: absolute;
    left: 0;
    top: calc(50% - 42px);
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}
.main-visual h1:before {
    width: 1078px;
    height: 295px;
    background: url(../images/visual-figure.png) no-repeat;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: -62px;
    transform: translateX(-50%);
    content: "";
    z-index: -1;
}
.main-visual h1 strong {
    font-weight: 800;
}
.main-visual .time-box {
    width: 100%;
    position: absolute;
    bottom: 77px;
    z-index: 10;
}
.main-visual .timeline {
    margin: 0 -16px;
}
.main-visual .timeline li {
    float: left;
    width: calc(25% - 32px);
    margin: 0 16px;
    color: #fff;
    height: auto;
    border-radius: 0;
    background: transparent;
}
.main-visual .timeline .num {
    font-family: "Roboto";
    font-size: 14px;
    font-weight: 700;
}
.main-visual .timeline .line {
    height: 3px;
    margin-top: 7px;
    background: rgba(255, 255, 255, 0.4);
    position: relative;
}
.main-visual .timeline .line:after {
    width: 0;
    height: 3px;
    background: #fff;
    opacity: 0;
    position: absolute;
    left: 0;
    content: "";
    transition: width 0.3s ease;
    transition-duration: 5s;
}
.main-visual .timeline .swiper-pagination-bullet-active .line:after {
    width: 100%;
    opacity: 1;
}
.main-visual .control {
    text-align: right;
}
.main-visual .stop,
.main-visual .play {
    width: 36px;
    height: 36px;
    border-radius: 100%;
    margin-bottom: 12px;
    background: url(../images/stop.png) no-repeat rgba(255, 255, 255, 0.2);
    background-size: contain;
    cursor: pointer;
}
.main-visual .play {
    background-image: url(../images/play.png);
    display: none;
}
.main-wrap .subtitle {
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: #000;
}
.main-wrap .subtitle span {
    display: inline-block;
    padding: 0 3px 3px 3px;
    position: relative;
}
.main-wrap .subtitle span:before {
    width: 100%;
    height: 10px;
    background: #3e3e3e;
    opacity: 0.2;
    position: absolute;
    left: 0;
    bottom: 0;
    content: "";
}
.main-wrap .main-vision {
    padding: 97px 0 107px;
    background: url(../images/mn-vision.jpg) no-repeat center;
    background-size: cover;
}
.main-wrap .main-vision .vision-box {
    margin: 53px -16px 58px;
}
.main-wrap .main-vision .vision-box li {
    float: left;
    width: calc(33.333% - 32px);
    margin: 0 16px;
    padding-top: calc(33.333% - 32px);
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.main-wrap .main-vision .vision-box li:nth-child(1) {
    background-image: url(../images/mn-vision1.jpg);
}
.main-wrap .main-vision .vision-box li:nth-child(2) {
    background-image: url(../images/mn-vision2.jpg);
}
.main-wrap .main-vision .vision-box li:nth-child(3) {
    background-image: url(../images/mn-vision3.jpg);
}
.main-wrap .main-vision .vision-box span {
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.5px;
    position: absolute;
    left: 41px;
    top: 32px;
}
.main-wrap .main-vision .vision-box dl {
    width: 100%;
    padding: 0 38px;
    position: absolute;
    left: 0;
    bottom: 43px;
    color: #fff;
}
.main-wrap .main-vision .vision-box dt {
    font-weight: 700;
    margin-bottom: 14px;
}
.main-wrap .main-vision .vision-box dd {
    font-weight: 300;
}
.main-wrap .main-story {
    padding: 125px 0 164px;
}
.main-wrap .main-story .item-nav {
    margin-bottom: 62px;
}
.main-wrap .main-story .item-box .tab {
    display: none;
}
.main-wrap .main-story .item-box .tab.active {
    display: block;
}
.main-wrap .story-box {
    margin: 0 -16px;
}
.main-wrap .story-box > div {
    float: left;
    margin: 0 16px;
}
.main-wrap .story-box > div ul li {
    position: relative;
    margin-bottom: 32px;
}
.main-wrap .story-box > div ul li:last-child {
    margin-bottom: 0;
}
.main-wrap .story-box > div ul li a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 1;
}
.main-wrap .story-box .box1 {
    width: calc(60% - 32px);
}
.main-wrap .story-box .box2 {
    width: calc(40% - 32px);
}
.main-wrap .story-box .box1 ul {
    display: block;
    clear: both;
    content: "";
}
.main-wrap .story-box .box1 li {
    height: 454px;
}
.main-wrap .story-box .box1 li.last {
    width: 416px;
    height: 268px;
    float: right;
}
.main-wrap .story-box .box2 li {
    height: 309px;
}
.main-wrap .story-box .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
}
.main-wrap .story-box .bg:before {
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.25;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    content: "";
}
.main-wrap .story-box .bg > div {
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transition: 0.5s ease-in-out;
}
.main-wrap .story-box > div ul li:hover .bg > div {
    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
}
.main-wrap .story-box .category {
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    position: absolute;
    left: 40px;
    top: 38px;
}
.main-wrap .story-box .category:before {
    width: 34px;
    height: 10px;
    background: #dddddd;
    position: absolute;
    left: -56px;
    top: 50%;
    margin-top: -5px;
    content: "";
}
.main-wrap .story-box .cont {
    width: 100%;
    padding: 0 38px;
    position: absolute;
    left: 0;
    bottom: 42px;
    color: #fff;
}
.main-wrap .story-box .cont .tit1 {
    margin-bottom: 10px;
}
.main-wrap .story-box .cont .txt {
    font-weight: 300;
}
/* Tab */
.item-nav ul:after {
    display: block;
    clear: both;
    content: "";
}
.item-nav ul li {
    float: left;
    margin-right: 50px;
    padding-bottom: 9px;
    font-family: "Open Sans", "NanumSquare", sans-serif;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #999;
    text-transform: uppercase;
    position: relative;
    transition: 0.3s ease-in-out;
}
.item-nav ul li span {
    font-size: 15px;
    font-weight: 400;
    position: absolute;
    left: 0;
    top: -25px;
}
.item-nav ul li:last-child {
    margin-right: 0;
}
.item-nav ul li.active {
    color: #000;
    border-bottom: 5px solid #000;
}
.item-nav ul li:hover {
    color: #000;
}
@media (max-width: 1217px) {
    .item-nav {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow-x: scroll;
    }
    .item-nav ul li {
        float: none;
        display: inline-block;
    }
}
@media (max-width: 1199px) {
    .main-visual h1:before {
        width: 94%;
        height: 295px;
        background-size: contain;
    }
}
@media (max-width: 1023px) {
    .footer .cs-box {
        padding: 30px 0;
        text-align: center;
        height: auto;
        margin-top: 0;
    }
    .footer .cs-box .container {
        height: auto;
    }
    .footer .cs-box .bt {
        position: static;
        margin-top: 30px;
    }
    .footer .cs-box p:before {
        margin: 0 auto 18px;
    }
    .footer.sub .cs-box {
        margin-top: -72px;
        background-image: url(../images/mo-cs.jpg);
        background-size: cover;
    }
    .footer .site-info .link {
        position: static;
        margin-bottom: 25px;
        display: inline-block;
    }
    .footer .site-info .info:before {
        display: none;
    }
    .main-wrap .main-vision .vision-box {
        white-space: nowrap;
        overflow-x: scroll;
    }
    .main-wrap .main-vision .vision-box li {
        width: calc(40% - 32px);
        padding-top: calc(40% - 32px);
        float: none;
        display: inline-block;
    }
}
@media (max-width: 767px) {
    .footer .site-info .info li {
        font-size: 13px;
        line-height: 1.61;
    }
    .mo-ver {
        display: block;
    }
    .pc-ver {
        display: none;
    }
    .tit1 {
        font-size: 18px;
    }
    .txt {
        font-size: 14px;
        line-height: 1.5;
    }
    .main-visual {
        height: 420px;
    }
    .main-visual h1 {
        font-size: 20px;
    }
    .main-visual h1:before {
        height: 96px;
        background-position: center;
        top: -20px;
    }
    .main-visual p {
        padding-top: 18vw;
        font-size: 26px;
        line-height: 1.38;
    }
    .main-visual .time-box {
        bottom: 72px;
    }
    .main-visual .timeline .num {
        font-size: 11px;
    }
    .main-visual .timeline {
        margin: 0 -10px;
    }
    .main-visual .timeline li {
        margin: 0 10px;
        width: calc(25% - 20px);
    }
    .main-visual .timeline .line,
    .main-visual .timeline .line:after {
        height: 2px;
    }
    .main-visual .control {
        text-align: left;
    }
    .main-wrap .main-vision {
        padding: 50px 0;
    }
    .main-wrap .main-vision .vision-box {
        margin: 30px -10px 40px;
    }
    .main-wrap .main-vision .vision-box li {
        width: calc(70% - 20px);
        padding-top: calc(70% - 20px);
        margin: 0 10px;
    }
    .main-wrap .main-vision .vision-box dl {
        padding: 0 15px;
        bottom: 20px;
    }
    .main-wrap .main-vision .vision-box span {
        font-size: 12px;
        left: 15px;
        top: 20px;
    }
    .main-wrap .main-story {
        padding: 50px 0;
    }
    .main-wrap .main-story .item-nav {
        margin-bottom: 30px;
    }
    .main-wrap .story-box > div ul li {
        margin-bottom: 15px;
    }
    .main-wrap .story-box .box1,
    .main-wrap .story-box .box2 {
        width: calc(100% - 32px);
    }
    .main-wrap .story-box .box1 li,
    .main-wrap .story-box .box2 li {
        height: 200px;
    }
    .main-wrap .story-box .box1 li.last {
        width: 100%;
        height: 200px;
    }
    .main-wrap .story-box .box2 li:first-child {
        margin-top: 15px;
    }
    .main-wrap .story-box .category {
        font-size: 12px;
        left: 15px;
        top: 20px;
    }
    .main-wrap .story-box .cont {
        padding: 0 15px;
        bottom: 20px;
    }
    .main-wrap .story-box .category:before {
        width: 17px;
        height: 3px;
        margin-top: -1.5px;
        left: -24px;
    }
    .bt {
        font-size: 12px;
        line-height: 36px;
        height: 36px;
        min-width: 150px;
    }
    .item-nav ul li {
        font-size: 14px;
        margin-right: 15px;
    }
    .item-nav ul li.active {
        border-width: 2px;
    }
    .footer .cs-box {
        margin-top: 50px;
        background-image: url(../images/mo-cs.jpg);
    }
    .footer .cs-box p {
        font-size: 18px;
    }
    .to-top {
        font-size: 12px;
        right: 15px;
        top: -44px;
    }
    .to-top:before {
        height: 20px;
        margin: 0 auto 7px;
    }
}

/* breadcrumb */
.breadcrumb {
    padding: 22px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.breadcrumb ul:after {
    display: block;
    clear: both;
    content: "";
}
.breadcrumb li {
    float: left;
    font-size: 14px;
    letter-spacing: -1px;
    color: #b6b6b6;
    text-transform: uppercase;
}
.breadcrumb li:after {
    display: inline-block;
    width: 6px;
    height: 10px;
    margin: 0 10px;
    background: url(../images/arrow-next.png) no-repeat;
    background-size: contain;
    content: "";
}
.breadcrumb li:last-child:after {
    display: none;
}
.breadcrumb li:first-child:before {
    display: inline-block;
    width: 11px;
    height: 12px;
    margin-right: 8px;
    background: url(../images/home.png) no-repeat;
    background-size: contain;
    content: "";
}
.breadcrumb li.on {
    color: #000;
    font-weight: 700;
}
@media (max-width: 767px) {
    .breadcrumb {
        padding: 15px 0;
    }
    .breadcrumb li {
        font-size: 12px;
    }
}

/* About */
.dot li {
    font-size: 15px;
    letter-spacing: -1px;
    color: #666;
    line-height: 1.66;
    padding-left: 10px;
    position: relative;
}
.dot li:before {
    width: 3px;
    height: 3px;
    background: #666;
    position: absolute;
    left: 0;
    top: 11px;
    content: "";
}
.sub-wrap {
    padding-bottom: 178px;
}
.sub-wrap .ttl-box {
    text-align: center;
    word-break: keep-all;
}
.sub-wrap .ttl-box p {
    line-height: 1.5;
}
.sub-wrap.about {
    background: url(../images/about-bg.jpg) no-repeat center bottom;
}
.sub-wrap.about .ttl-box h1 {
    padding: 128px 0 153px;
    font-size: 45px;
    font-weight: 400;
    letter-spacing: -2px;
    line-height: 1.33;
    color: #000;
    background: url(../images/about-figure.png) no-repeat top 100px left 140px;
}
.sub-wrap.about .ttl-box h1 span {
    font-weight: 900;
}
.sub-wrap.about .banner-box > li {
    margin-bottom: 80px;
}
.sub-wrap.about .banner-box > li:last-child {
    margin-bottom: 0;
}
.sub-wrap.about .banner-box > li:after {
    display: block;
    clear: both;
    content: "";
}
.sub-wrap.about .banner-box > li > div {
    float: left;
    width: 50%;
}
.sub-wrap.about .banner-box > li > div:first-child {
    position: relative;
}
.sub-wrap.about .banner-box > li > div:first-child:before {
    position: absolute;
    background-repeat: no-repeat;
    content: "";
}
.sub-wrap.about .banner-box > li:nth-child(1) > div:first-child:before {
    width: 176px;
    height: 150px;
    left: -85px;
    bottom: -56px;
    background-image: url(../images/about-figure1.png);
}
.sub-wrap.about .banner-box > li:nth-child(2) > div:first-child:before {
    width: 213px;
    height: 213px;
    right: 18px;
    bottom: -79px;
    background-image: url(../images/about-figure2.png);
}
.sub-wrap.about .banner-box > li:nth-child(3) > div:first-child:before {
    width: 160px;
    height: 160px;
    left: -78px;
    bottom: 63px;
    background-image: url(../images/about-figure3.png);
}
.sub-wrap.about .banner-box > li > div:last-child:before {
    display: block;
    width: 25px;
    height: 23px;
    margin-bottom: 28px;
    background: url(../images/quotes.png) no-repeat;
    background-size: contain;
    content: "";
}
.sub-wrap.about .banner-box > li:nth-child(even) > div {
    float: right;
}
.sub-wrap.about .banner-box > li:nth-child(odd) > div:last-child {
    padding-left: 55px;
}
.sub-wrap.about .banner-box h2 {
    margin: 8px 0 35px;
    font-size: 32px;
    letter-spacing: -1px;
    color: #000;
}
.sub-wrap.about .banner-box .txt {
    color: #111;
}
.sub-wrap.about .banner-box .dot {
    margin: 12px 0 46px;
}
@media (max-width: 1023px) {
    .sub-wrap.about .ttl-box h1 {
        font-size: 29px;
        background-size: contain;
        background-position: left top 100px;
    }
    .sub-wrap.about .banner-box > li:nth-child(odd) > div:last-child {
        padding-left: 20px;
    }
    .sub-wrap.about .banner-box > li:nth-child(even) > div:last-child {
        padding-right: 20px;
    }
}
@media (max-width: 767px) {
    .sub-wrap {
        padding-bottom: 140px;
    }
    .dot li {
        font-size: 1rem;
    }
    .sub-wrap.about .ttl-box h1 {
        padding: 50px 0 60px;
        background-position: left top 40px;
    }
    .sub-wrap.about .banner-box > li {
        margin-bottom: 50px;
    }
    .sub-wrap.about .banner-box > li > div {
        width: 100%;
    }
    .sub-wrap.about .banner-box > li > div:last-child {
        margin-top: 30px;
    }
    .sub-wrap.about .banner-box > li > div:last-child:before {
        width: 15px;
        height: 14px;
        margin-bottom: 10px;
    }
    .sub-wrap.about .banner-box > li > div:first-child:before {
        background-size: contain;
    }
    .sub-wrap.about .banner-box > li:nth-child(1) > div:first-child:before {
        width: 88px;
        height: 75px;
        left: -10px;
        bottom: -20px;
    }
    .sub-wrap.about .banner-box > li:nth-child(2) > div:first-child:before {
        width: 80px;
        height: 80px;
        bottom: -20px;
    }
    .sub-wrap.about .banner-box > li:nth-child(3) > div:first-child:before {
        width: 60px;
        height: 60px;
        left: -10px;
        bottom: 30px;
    }
    .sub-wrap.about .banner-box > li:nth-child(odd) > div:last-child {
        padding-left: 0;
    }
    .sub-wrap.about .banner-box h2 {
        margin: 5px 0 20px;
        font-size: 22px;
    }
    .sub-wrap.about .banner-box .dot {
        margin: 10px 0 20px;
    }
}

/* Storytelling */
.sub-wrap .ttl-box .ttl {
    margin-bottom: 12px;
    font-size: 28px;
    color: #000;
    text-transform: uppercase;
}
.sub-wrap.story .ttl-box {
    padding: 100px 0 48px;
    background: url(../images/story-figure.png) no-repeat center 60px;
}
.post-box .post-head .count {
    float: left;
    font-size: 17px;
    color: #111;
    letter-spacing: -1px;
    line-height: 46px;
}
.post-box .post-head .count span {
    font-weight: 700;
}
.post-box .post-head .form {
    float: right;
    width: 31%;
    font-size: 0;
}
.post-box .post-head .form .category,
.post-box .post-head .form .search {
    display: inline-block;
    vertical-align: top;
    font-size: 15px;
}
.post-box .post-head .category select {
    width: 65px;
    appearance: none;
    -webkit-appearance: none;
    background: url(../images/select.png) no-repeat center right / 14px 9px;
}
.post-box .post-head .category select,
.post-box .post-head .search input[type="text"] {
    height: 46px;
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid #000;
}
.post-box .post-head .search {
    width: 100%;
    position: relative;
}
.post-box .post-head .search input[type="text"] {
    width: 100%;
}
.post-box .post-head .search .submit {
    border: 0;
    width: 18px;
    height: 18px;
    background: url(../images/search.png) no-repeat;
    background-size: contain;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -9px;
}
.post-box .post .thumn {
    position: relative;
}
.post-box .post .thumn .date {
    width: 91px;
    height: 86px;
    display: table;
    font-size: 12px;
    color: #fff;
    position: absolute;
    left: -7px;
    top: -7px;
}
.post-box .post .thumn .date:before {
    width: 100%;
    height: 100%;
    background: #f57e20;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    content: "";
}
.post-box .post .thumn .date > div {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    letter-spacing: 1.5px;
}
.post-box .post .thumn .date span {
    font-size: 30px;
    font-weight: 600;
    display: block;
    margin-bottom: 6px;
    letter-spacing: -1px;
}
.post-box .post {
    margin: 48px -24px 0;
    font-size: 0;
}
.post-box .post > li {
    display: inline-block;
    width: calc(33.333% - 48px);
    margin: 0 24px 80px;
    font-size: 15px;
    vertical-align: top;
}
.post-box .post > li:hover .date {
    z-index: 1;
}
.post-box .post h2 {
    margin: 18px 0;
    font-size: 23px;
    line-height: 1.39;
    color: #111;
    color: #111;
    letter-spacing: -1px;
}
.post-box .post p {
    line-height: 1.53;
    color: #666;
    letter-spacing: -1px;
    height: 44px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
/* Storytelling > 상세 */
.view-ttl {
    padding: 67px 0 48px;
    border-bottom: 1px solid #d7d7d7;
    text-align: center;
}
.view-ttl .category {
    display: inline-block;
    padding: 8px 13px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.5px;
    background: #000;
    text-transform: uppercase;
}
.view-ttl h2 {
    margin: 30px 0;
    font-size: 35px;
    font-weight: 400;
    letter-spacing: -1px;
    color: #111;
}
.view-ttl .date {
    color: #a4a4a4;
    letter-spacing: -0.5px;
}
.view-cont {
    margin-bottom: 166px;
    padding: 45px 90px 0;
    font-size: 15px;
    letter-spacing: -1px;
    color: #666;
    line-height: 1.66;
}
.post-nav ul {
    padding-top: 48px;
    border-top: 2px solid #000;
}
.post-nav ul:after {
    display: block;
    clear: both;
    content: "";
}
.post-nav ul li {
    float: left;
    width: calc(50% - 38px);
    min-height: 76px;
    text-align: center;
    font-size: 17px;
    color: #888;
    letter-spacing: -1px;
    position: relative;
}
.post-nav ul li:nth-child(2) {
    width: 76px;
}
.post-nav ul li:first-child:before,
.post-nav ul li:last-child:before {
    width: 8px;
    height: 13px;
    background: url(../images/pagination.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    margin-top: -6.5px;
    opacity: 0;
    content: "";
}
.post-nav ul li p {
    padding: 0 10px;
}
.post-nav ul li:first-child:before {
    left: 0;
    transform: rotate(180deg);
    transition: left 0.3s ease, opacity 0.3s ease;
}
.post-nav ul li:last-child:before {
    right: 0;
    transition: right 0.3s ease, opacity 0.3s ease;
}
.post-nav ul li:hover:first-child:before,
.post-nav ul li:hover:last-child:before {
    opacity: 1;
}
.post-nav ul li:hover:first-child:before {
    left: 54px;
}
.post-nav ul li:hover:last-child:before {
    right: 54px;
}
.post-nav ul li:hover p {
    font-weight: 700;
    color: #111;
}
.post-nav .nav-ttl {
    display: block;
    margin-bottom: 20px;
    font-size: 17px;
    font-weight: 600;
    color: #111;
    letter-spacing: -0.5px;
    text-transform: uppercase;
}
.post-nav .list {
    display: inline-block;
    width: 100%;
    height: 76px;
    background: url(../images/list.png) no-repeat center / 25px 19px #111;
}
@media (max-width: 1023px) {
    .post-box .post h2 {
        font-size: 16px;
    }
}
@media (max-width: 767px) {
    .sub-wrap.story .ttl-box {
        padding: 50px 0 30px;
        background-size: contain;
        background-position: top 30px center;
        background-image: url(../images/mo-story.png);
    }
    .post-box .post-head .count,
    .post-box .post-head .form {
        float: none;
    }
    .post-box .post-head .count {
        width: 100%;
        font-size: 1rem;
    }
    .post-box .post-head .form {
        width: 100%;
    }
    .post-box .post-head .form .category,
    .post-box .post-head .form .search {
        font-size: 1rem;
    }
    .post-box .post-head .category select {
        width: 100px;
    }
    .post-box .post h2 {
        margin: 10px 0;
    }
    .post-box .post > li {
        width: calc(100% - 48px);
        font-size: 1rem;
        margin-bottom: 50px;
    }
    .view-ttl {
        padding: 30px 0 20px;
    }
    .view-ttl .category {
        font-size: 13px;
    }
    .view-ttl h2 {
        margin: 20px 0;
        font-size: 22px;
    }
    .view-cont {
        padding: 20px 0 0;
        margin-bottom: 70px;
        font-size: 1rem;
    }
    .post-nav ul {
        padding-top: 20px;
    }
    .post-nav ul li {
        width: calc(50% - 15px);
        font-size: 13px;
    }
    .post-nav ul li p {
        line-height: 1.3;
    }
    .post-nav ul li:nth-child(2) {
        width: 30px;
    }
    .post-nav .nav-ttl {
        font-size: 15px;
        margin-bottom: 10px;
    }
    .post-nav .list {
        height: 30px;
        background-size: 14px 8px;
    }
}
/* Fix the street */
.sub-wrap.fts .ttl-box {
    background-image: url(../images/fix-figure.png);
}
.sub-wrap.fts .post-box .post .thumn .date:before {
    background: #1f5dd0;
}

/* Street art furniture */
.sub-wrap.saf .ttl-box {
    background-image: url(../images/street-figure.png);
    background-position: center top 85px;
}
.sub-wrap.saf .post-box .post .thumn .date:before {
    background: #01b14c;
}
@media (max-width: 767px) {
    .sub-wrap.fts .ttl-box {
        background-image: url(../images/mo-fix.png);
    }
    .sub-wrap.saf .ttl-box {
        background-image: url(../images/mo-saf.png);
        background-position: center top 50px;
    }
}

/* Contact */
.sub-wrap.contact .ttl-box {
    padding: 100px 0 84px;
    background: url(../images/contact-figure.png) no-repeat center top 77px;
}
.form-box .form {
    border-top: 1px solid #222;
}
.form-box .form > li {
    padding: 10px 0 10px 167px;
    border-bottom: 1px solid #e7e7e7;
    position: relative;
}
.form-box .form > li:last-child {
    padding-bottom: 0;
}
.form-box .form > li:before {
    width: 167px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
}
.form-box .form > li.full {
    padding-left: 0;
}
.form-box .form p {
    font-size: 14px;
    line-height: 1.7;
    color: #888;
    letter-spacing: -0.5px;
}
.form-box .input {
    display: block;
    width: 100%;
    height: 48px;
    line-height: 48px;
    border: 0;
    border-radius: 0;
    padding: 0 20px;
    color: #111;
    letter-spacing: -0.5px;
    -webkit-appearance: none;
    background: #f4f4f4;
}
.form-box .input.limit {
    max-width: 223px;
}
.form-box .input:-ms-input-placeholder {
    color: #222;
    opacity: 0.3;
}
.form-box .input::-webkit-input-placeholder {
    color: #222;
    opacity: 0.3;
}
.form-box .input::-moz-placeholder {
    color: #222;
    opacity: 0.3;
}
.form-box .input::-o-placeholder {
    color: #222;
    opacity: 0.3;
}
.form-box .label {
    padding-left: 15px;
    position: absolute;
    left: 0;
    top: 20px;
    line-height: 48px;
    font-size: 17px;
    font-weight: 700;
    color: #111;
    letter-spacing: -0.5px;
}
.form-box .label.require:before {
    width: 4px;
    height: 4px;
    background: #111;
    position: absolute;
    left: 0;
    top: 22px;
    content: "";
}
.form-box .label.msg {
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.form-box .label.privacy {
    line-height: 24px;
}
.form-box .label.privacy:before {
    top: 10px;
}
.form-box.en .label {
    left: 15px;
}
.form-box textarea.input {
    height: 200px;
    padding-top: 15px;
    line-height: normal;
}
.form-box .check-box.agree {
    text-align: right;
    padding-bottom: 20px;
}
.form-box .check-box label,
.form-box .check-box li {
    position: relative;
    padding-left: 32px;
}
.form-box ul.check-box {
    padding-left: 0;
}
.form-box .check-box li {
    display: inline-block;
    margin-right: 30px;
}
.form-box .check-box li:last-child {
    margin-right: 0;
}
.form-box .check-box li .label {
    line-height: 48px;
}
.form-box .check-box input {
    opacity: 0;
}
.form-box .check-box input,
.form-box .check-box span:before {
    width: 24px;
    height: 24px;
    border-radius: 0;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -12px;
}
.form-box .check-box span {
    font-size: 15px;
    vertical-align: top;
    letter-spacing: -0.5px;
    color: #111;
    position: static;
}
.form-box .check-box span:before {
    background: #e3e3e3;
    content: "";
}
.form-box .check-box .label {
    padding-left: 30px;
}
.form-box .check-box input:checked + span:before {
    background: url(../images/ck-on.png) no-repeat center;
    background-size: contain;
}
.form-box .form .grid-box {
    padding-left: 0;
}
.form-box .grid-box > div {
    width: 50%;
    padding-left: 167px;
    position: relative;
    float: left;
    line-height: 48px;
}
.form-box .grid-box > div:first-child {
    padding-right: 28px;
}
.form-box .grid-box > div:first-child .input {
    max-width: 415px;
}
.form-box .grid-box > div:first-child .input.limit {
    max-width: 223px;
}
.form-box .grid-box > div:last-child {
    position: relative;
}
.form-box .grid-box > div:last-child:before {
    width: 167px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
}
.form-box .grid-box > div .label {
    top: 0;
}
.form-box .grid-box > div:last-child .label {
    left: 50px;
}
.form-box select.input {
    appearance: none;
    -webkit-appearance: none;
    background: url(../images/select.png) no-repeat center right 16px #f4f4f4;
    background-size: 14px 9px;
}
.form-box select.input::-ms-expand {
    display: none;
}
.form-box .mail-box > div {
    float: left;
    width: calc(50% - 14px);
    position: relative;
}
.form-box .mail-box .email_user_box {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 45px);
}
.form-box .mail-box .email_user_box.active {
    display: inline-block;
}
.form-box .mail-box > div.bar {
    width: 28px;
    text-align: center;
    line-height: 48px;
}
.form-box .terms-box {
    max-height: 200px;
    overflow-y: scroll;
    padding: 26px 30px;
    border: 1px solid #e1e1e1;
    letter-spacing: -0.5px;
    margin-bottom: 20px;
}
.form-box .terms-box strong {
    font-weight: 700;
    color: #111;
    line-height: 1.56;
}
.form-box .terms-box p {
    margin-bottom: 20px;
    font-weight: 300;
    font-size: 14px;
    line-height: 1.7;
    color: #888;
}
.form-box .terms-box p:last-child {
    margin-bottom: 0;
}
.form-box .btn-box {
    text-align: center;
    padding-top: 58px;
}
.form-box .btn-box input[type="submit"] {
    display: inline-block;
    width: 234px;
    border: 0;
    cursor: pointer;
}
.form-box .btn-box input[type="submit"]:hover {
    border: 1px solid #3e3e3e;
}
@media (max-width: 1023px) {
    .form-box .input {
        padding: 0 10px;
    }
    .form-box select.input {
        background-position: center right 10px;
    }
    .form-box .grid-box > div {
        margin-bottom: 5px;
        padding-bottom: 5px;
        border-bottom: 1px solid #e7e7e7;
    }
    .form-box .grid-box > div:first-child,
    .form-box .grid-box > div:last-child {
        width: 100%;
    }
    .form-box .grid-box > div:first-child {
        padding-right: 0;
    }
    .form-box .grid-box > div:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: 0;
    }
    .form-box .grid-box > div:last-child .input,
    .form-box .input.limit,
    .form-box .mail-box {
        max-width: 100%;
    }
    .form-box .grid-box .select-box select.input {
        max-width: 98%;
    }
}
@media (max-width: 767px) {
    .form-box .form > li {
        padding: 5px 0 5px 100px;
    }
    .form-box .form > li:before,
    .form-box .grid-box > div:last-child:before {
        width: 95px;
    }
    .form-box .label {
        top: 5px;
        left: 5px;
        font-size: 1rem;
        line-height: 35px;
    }
    .form-box .label.require:before {
        top: 16px;
    }
    .form-box .label.privacy:before {
        top: 6px;
    }
    .form-box .input {
        font-size: 1rem;
    }
    .form-box .input,
    .form-box .mail-box > div.bar {
        height: 35px;
        line-height: 35px;
    }
    .form-box .mail-box > div {
        width: calc(50% - 14px);
    }
    /* .form-box .mail-box>div:last-child { width: 100%; margin-left: 0; margin-top: 5px; } */
    .form-box .check-box li {
        margin-right: 10px;
        margin-bottom: 0;
    }
    .form-box .check-box li .label {
        line-height: 32px;
    }
    .form-box .check-box .label {
        padding-left: 20px;
    }
    .form-box .check-box input,
    .form-box .check-box span:before {
        width: 15px;
        height: 15px;
        margin-top: -7.5px;
    }
    .form-box .terms-box {
        padding: 10px 15px;
        margin-bottom: 10px;
    }
    .form-box .terms-box strong {
        font-size: 14px;
    }
    .form-box .terms-box p {
        font-size: 12px;
        line-height: 1.2;
        margin-bottom: 10px;
    }
    .form-box .grid-box > div {
        padding-left: 100px;
    }
    .form-box .grid-box > div:last-child .label {
        left: 5px;
    }
    .form-box .select-box li {
        width: 100%;
        margin-bottom: 5px;
    }
    .form-box .select-box li:last-child {
        margin-bottom: 0;
    }
    .form-box select.input.limit,
    .form-box .grid-box .select-box select.input {
        max-width: 100%;
    }
    .form-box .form p {
        font-size: 12px;
        line-height: 1.2;
    }
    .form-box .label.privacy {
        line-height: 16px;
    }
    .filebox label {
        height: 35px;
        line-height: 35px;
    }
    .form-box .check-box label,
    .form-box .check-box li {
        padding-left: 20px;
    }
    .form-box .check-box span {
        font-size: 1rem;
    }
    .form-box .btn-box input[type="submit"] {
        height: 35px;
        width: 100px;
        font-size: 1rem;
    }
    .form-box .grid-box > div:first-child .input.limit {
        max-width: 100%;
    }

    .sub-wrap.contact .ttl-box {
        padding: 50px 0 40px;
        background-size: 200%;
        background-position: center 40px;
    }
}

/* youtube brain 230208 */
figure .wp-block-embed__wrapper {
    position: relative;
    height: 0;
    padding-bottom: 56.25%;
}
figure .wp-block-embed__wrapper > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}