@charset "UTF-8";
/* CSS Document */

.contents {
    position: relative;
    z-index: 1;
    width: auto;
    margin: 0 auto;
    padding: 0;
    text-align: left;
    line-height: 1.5;
    line-height: 1.5;
}

.contents * {
    box-sizing: border-box;
}

.spheader-title {
    display: none;
}

@media screen and (max-width: 767px) {
    .only-pc,
	.pc-only {
		display: none !important;
	}

	.only-sp,
	.sp-only  {
		display: block !important;
	}

    .wrap {
        min-width: inherit;
        padding-top: 0;
    }

    .contents {
        width: 100%;
        padding: 0;
        box-sizing: border-box;
    }

    header {
		position: relative;
		width: 100%;
		left: 0;
		top: 0;
		margin-left: 0;
	}

	header .logo {
		float: none;
		display: block;
		margin: 0 auto;
	}

	header .nav-global {
		display: none;
	}

	.spheader-title {
		display: block;
		width: 100%;
		background: #0B9FE6;
		color: #fff;
		font-size: 22px;
		padding: 10px 0;
		font-family: "AxisStd-Medium", serif;
		text-align: center;
	}

    .nav-fixed .products-all,
    .nav-fixed .products-type {
		display: none;
	}
}

.common-area .bl-inquiry::before {
     display: block;
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     width: 100%;
     height: 500px;
     background-color: transparent;
     background-position: center center;
     background-repeat: no-repeat;
     background-size: cover;
     transition: -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1), -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     z-index: -1;
     content: "";
}
 .common-area .bl-inquiry::before {
     background-image: url(../images/bg_inquiry.jpg);
}
 .common-area .bl-inquiry:hover::before {
     -webkit-transform: scale(1.02);
     transform: scale(1.02);
}
 .common-area .bl {
     position: relative;
     width: 100%;
     margin: 0 auto;
     max-width: 918px;
     z-index: 2;
}
 .common-area .bl-inquiry {
     max-width: 100%;
}
 .common-area .bl-inquiry {
     margin-bottom: 72px;
     padding-top: 150px;
}
 .common-area .bl.bl-inquiry {
     position: relative;
     height: 500px;
     color: #fff;
     text-align: center;
     overflow: hidden;
     max-width: inherit;
     margin-bottom: 100px;
}
 .common-area .bl-inquiry .font-langM {
     font-family: "AxisStd-Medium";
}
 .common-area .bl-inquiry .txt-inquiry {
     margin-bottom: 53px;
     font-size: 28px;
     line-height: 1.5;
     -webkit-font-feature-settings: "palt";
     font-feature-settings: "palt";
     letter-spacing: 0.05em;
}
 .common-area .bl-inquiry .nav-inquiry {
     display: flex;
     justify-content: center;
     padding-left: 20px;
     padding-right: 20px;
}
 .common-area .bl-inquiry .nav-inquiry .btn-wrap {
     max-width: 426px;
     width: 100%;
}
 .common-area .bl-inquiry .nav-inquiry .btn-wrap:first-child {
     margin-right: 3rem;
}
 .common-area .bl-inquiry .nav-inquiry .btn-wrap a {
     max-width: none;
     font-size: 1.6rem;
     padding-top: 2rem;
     padding-bottom: 2rem;
}
 .common-area .common-outer-base-width {
     padding-left: 23px;
     padding-right: 23px;
}
 .common-area .box-breadcrumbs {
     font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
     max-width: 978px;
     width: 100%;
     margin: 0 auto;
     border-top: solid 1px #dfe0e1;
     border-bottom: solid 1px #efeff0;
     font-size: 12px;
}
 .common-area .box-breadcrumbs a {
     transition: 0s;
}
 .common-area .box-breadcrumbs a:link, .common-area .box-breadcrumbs a:visited {
     color: #00a0e6;
     text-decoration: none;
}
 .common-area .box-breadcrumbs a:hover, .common-area .box-breadcrumbs a:active {
     color: #ffa200 !important;
     text-decoration: none;
}
 .common-area .box-breadcrumbs ul li a:link, .common-area .box-breadcrumbs ul li a:visited {
     color: #878b8f;
}
 .common-area .box-breadcrumbs ul {
     padding: 13px 0;
     border-top: solid 1px #efeff0;
     border-bottom: solid 1px #dfe0e1;
     display: flex;
}
 .common-area .box-breadcrumbs ul li {
    /*float: left;
    */
     padding-left: 5px;
     color: #878b8f;
}
 .common-area .box-breadcrumbs ul li:first-child {
     padding-left: 0;
}
 .common-area .box-breadcrumbs ul li.act {
     color: #ffa200;
}
 .common-area .box-breadcrumbs ul li a {
     margin-right: 5px;
}
 @media print, screen and (max-width: 767.98px) {
     .common-area .bl.bl-inquiry .txt-inquiry {
         font-size: 20px;
         text-align: left;
         padding: 0 30px;
         margin-bottom: 24px;
    }
     .common-area .bl.bl-inquiry {
         margin-bottom: 50px;
         padding: 106px 0;
         height: auto;
    }
     .common-area .bl.bl-inquiry .nav-inquiry {
         padding-left: 20px;
         padding-right: 20px;
         display: block;
    }
     .common-area .bl.bl-inquiry .nav-inquiry .btn-wrap {
         max-width: none;
         margin-top: 16px;
    }
     .common-area .bl.bl-inquiry .nav-inquiry .btn-wrap a {
         padding-top: 0;
         padding-bottom: 0;
         line-height: 40px;
    }
}

footer.wrp-footer .footer-contents {
	box-sizing: content-box;
}

 /* footer.wrp-footer {
     text-align: center;
}
 footer.wrp-footer .cfx:after {
     content: '';
     display: block;
     clear: both;
     height: 0;
}
 footer.wrp-footer a {
     transition: 0s;
}
 footer.wrp-footer a:link, footer.wrp-footer a:visited {
     color: #00a0e6;
     text-decoration: none;
}
 footer.wrp-footer a:hover, footer.wrp-footer a:active {
     color: #ffa200;
     text-decoration: none;
}
 footer.wrp-footer .footer-contents {
     width: 100%;
     max-width: 978px;
     margin: 0 auto;
     padding: 0 23px;
     text-align: left;
     box-sizing: content-box;
}
 footer.wrp-footer .sitemap {
     padding-top: 39px;
     border-bottom: solid 1px #dfe0e1;
}
 footer.wrp-footer .sitemap .logo {
     float: left;
     width: 252px;
     color: #ffffff;
}
 footer.wrp-footer .sitemap .logo .logo-wrap {
     width: 132px;
     display: block;
}
 footer.wrp-footer .sitemap .box-cell {
     float: left;
     width: 252px;
}
 footer.wrp-footer .sitemap .box-cell.last {
     width: 222px;
}
 footer.wrp-footer .sitemap .box-cell .tit {
     margin-bottom: 15px;
     padding-right: 10px;
     font-family: "AxisStd-Medium";
     font-size: 16px;
     color: #00a0e6;
     line-height: 1.4;
}
 footer.wrp-footer .sitemap .box-cell ul {
     padding-bottom: 33px;
}
 footer.wrp-footer .sitemap .box-cell ul li {
     font-size: 12px;
     margin-bottom: 5px;
     line-height: 1.4;
     font-family: "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
 footer.wrp-footer .sitemap .box-cell ul li a:link, footer.wrp-footer .sitemap .box-cell ul li a:visited {
     color: #878b8f;
}
 footer.wrp-footer .sitemap .box-cell ul li a:hover, footer.wrp-footer .sitemap .box-cell ul li a:active {
     color: #ffa200;
}
 footer.wrp-footer .nav-otherinfo {
     padding: 21px 0 42px;
     border-top: solid 1px #efeff0;
     font-family: "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
 footer.wrp-footer .nav-otherinfo .link-list {
     float: left;
     width: 920px;
     font-size: 12px;
     line-height: 1.4;
}
 footer.wrp-footer .nav-otherinfo .link-list {
     width: 880px;
}
 footer.wrp-footer .nav-otherinfo .link-list li {
     float: left;
     margin-right: 15px;
     margin-bottom: 5px;
}
 footer.wrp-footer .txt-bold {
     font-weight: bold !important;
}
 footer.wrp-footer .nav-otherinfo .language {
     float: right;
     position: relative;
     width: 90px;
     height: 17px;
     cursor: pointer;
}
 footer.wrp-footer .nav-otherinfo .language img {
     width: 90px;
}
 footer.wrp-footer .nav-otherinfo .language .float-menu {
     position: absolute;
     bottom: 28px;
     display: none;
     left: 50%;
     width: 110px;
     margin-left: -55px;
     background-color: #ffffff;
     -webkit-box-shadow: 3px 3px 4px rgba(50, 50, 50, 0.25);
     -moz-box-shadow: 3px 3px 4px rgba(50, 50, 50, 0.25);
     box-shadow: 3px 3px 4px rgba(50, 50, 50, 0.25);
     font-size: 16px;
     text-align: center;
}
 footer.wrp-footer .nav-otherinfo .language .float-menu a {
     display: block;
     padding: 12px 0;
}
 footer.wrp-footer .footer-copy {
     background-color: #f7f7f7;
     padding: 45px 0 140px;
     font-family: "DIN Next W01 Medium";
     color: #5f6469;
}
 footer.wrp-footer .footer-copy .logo-nabtesco {
     display: -moz-inline-stack;
     display: inline-block;
     vertical-align: middle;
     *vertical-align: auto;
     zoom: 1;
     *display: inline;
     width: 227px;
     height: 36px;
}
 footer.wrp-footer .footer-copy .logo-nabtesco {
     display: -moz-inline-stack;
     display: inline-block;
     vertical-align: middle;
     zoom: 1;
     width: 227px;
     height: 36px;
}
 footer.wrp-footer .footer-copy .group {
     margin: 22px 0 13px;
     font-size: 17px;
     color: #5f6469;
}
 @media print, screen and (min-width: 768px) and (max-width: 1024px) {
     footer.wrp-footer.wrp-footer .sitemap .logo {
         width: 25.76687116564417%;
    }
     footer.wrp-footer.wrp-footer .sitemap .box-cell {
         width: 25.76687116564417%;
    }
     footer.wrp-footer.wrp-footer .sitemap .box-cell.last {
         width: 22.69938650306748%;
    }
     footer.wrp-footer.wrp-footer .sitemap .box-cell .tit {
         font-size: 1.5625vw;
    }
     footer.wrp-footer.wrp-footer .sitemap .box-cell ul li {
         font-size: 1.171875vw;
    }
     footer.wrp-footer.wrp-footer .nav-otherinfo .link-list {
         width: 89.97955010224949%;
    }
     footer.wrp-footer.wrp-footer .nav-otherinfo .language {
         width: 9.202453987730061%;
    }
     footer.wrp-footer.wrp-footer .nav-otherinfo .language img {
         width: 100%;
    }
     footer.wrp-footer.wrp-footer .footer-contents {
         box-sizing: border-box;
    }
}
 @media print, screen and (max-width: 767.98px) {
     footer.wrp-footer.wrp-footer {
         font-family: "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
         margin-top: 40px;
         border-top: solid 2px #00a0e6;
         text-align: left;
         padding-bottom: 60px;
    }
     footer.wrp-footer.wrp-footer a {
         display: block;
    }
     footer.wrp-footer.wrp-footer a:link, footer.wrp-footer.wrp-footer a:visited {
         color: #00a0e6;
         text-decoration: none;
    }
     footer.wrp-footer.wrp-footer a:hover, footer.wrp-footer.wrp-footer a:active {
         color: #ffa200;
         text-decoration: none;
    }
     footer.wrp-footer.wrp-footer .link-top {
         margin-bottom: 27px;
         border-bottom: solid 1px #dddddd;
         font-size: 15px;
         text-align: center;
    }
     footer.wrp-footer.wrp-footer .link-top a {
         display: block;
         padding: 12px 0;
         color: #333333;
    }
     footer.wrp-footer.wrp-footer .link-top a .link-inner {
         display: inline-block;
         padding-left: 25px;
         background: url(../images/icn_top.png) no-repeat left 2px;
         background-size: 16px 11px;
    }
     footer.wrp-footer.wrp-footer .font-langM {
         font-family: "AxisStd-Medium";
    }
     footer.wrp-footer.wrp-footer .global-nav {
         margin: 0 25px 20px;
    }
     footer.wrp-footer.wrp-footer .global-nav li {
         float: left;
         width: 50%;
         margin-bottom: 24px;
         font-size: 15px;
    }
     footer.wrp-footer.wrp-footer .global-nav li a {
         color: #333333;
    }
     footer.wrp-footer.wrp-footer .sub-nav {
         margin: 0 15px 30px;
    }
     footer.wrp-footer.wrp-footer .sub-nav li {
         display: inline-block;
         margin: 0 10px 5px;
         font-size: 12px;
         line-height: 1.8;
         font-family: "AxisStd-Medium";
    }
     footer.wrp-footer.wrp-footer .footer-copy {
         padding: 32px 0;
         background-color: #f7f7f7;
         text-align: center;
    }
     footer.wrp-footer.wrp-footer .footer-copy .logo-nabtesco {
         margin-bottom: 7px;
    }
     footer.wrp-footer.wrp-footer .footer-copy .group {
         margin-bottom: 7px;
         font-size: 11px;
    }
     footer.wrp-footer.wrp-footer .footer-copy .group a {
         display: inline;
    }
     footer.wrp-footer.wrp-footer .footer-copy .copyright {
         font-size: 10px;
    }
}
 footer.wrp-footer .footer-copy {
     background-color: #f7f7f7;
     padding: 45px 0 140px;
     font-family: "DIN Next W01 Medium";
     color: #5f6469;
}
 footer.wrp-footer .footer-copy .logo-nabtesco {
     display: -moz-inline-stack;
     display: inline-block;
     vertical-align: middle;
     *vertical-align: auto;
     zoom: 1;
     *display: inline;
     width: 227px;
     height: 36px;
}
 footer.wrp-footer .footer-copy .logo-nabtesco {
     display: -moz-inline-stack;
     display: inline-block;
     vertical-align: middle;
     zoom: 1;
     width: 227px;
     height: 36px;
}
 footer.wrp-footer .footer-copy .group {
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 22px 0 13px;
     font-size: 17px;
     color: #5f6469;
}
 footer.wrp-footer .footer-copy .group .copy-logo {
     display: flex;
     flex-wrap: nowrap;
     width: auto;
     margin-right: 20px;
}
 .wrp-footer .footer-copy .group .copy-logo img {
     max-width: 320px;
}
 footer.wrp-footer .footer-copy .group .copy-logo::after {
     content: '|';
     display: inline-block;
     margin-left: 10px;
}
 @media print, screen and (max-width: 767.98px) {
     footer.wrp-footer.wrp-footer .footer-copy {
         padding: 32px 0;
         background-color: #f7f7f7;
         text-align: center;
    }
     footer.wrp-footer.wrp-footer .footer-copy .logo-nabtesco {
         margin-bottom: 7px;
    }
     footer.wrp-footer.wrp-footer .footer-copy .group {
         margin-bottom: 7px;
         font-size: 11px;
    }
     footer.wrp-footer .footer-copy .group .copy-logo {
         width: auto;
         margin-right: 15px;
    }
     footer.wrp-footer .footer-copy .group .copy-logo img {
         max-width: 200px;
    }
     footer.wrp-footer .footer-copy .group .copy-logo::after {
         margin-left: 5px;
    }
     footer.wrp-footer.wrp-footer .footer-copy .group a {
         display: inline;
    }
     footer.wrp-footer.wrp-footer .footer-copy .copyright {
         font-size: 10px;
    }
} */
 .nav-fixed {
     position: fixed;
     z-index: 100;
     left: 0;
     display: none;
     bottom: 0px;
     width: 100%;
     height: 60px;
     background-color: #00a0e6;
     box-sizing: content-box;
     font-family: "AxisStd-Medium";
}
 .nav-fixed * {
     box-sizing: content-box;
}
 .nav-fixed ul {
     width: 1026px;
     margin: 0 auto;
}
 .nav-fixed ul li {
     float: left;
    /* width: 255px;
     */
     width: 33%;
     border-right: solid 1px #80d0f3;
}
 .nav-fixed ul li:first-child {
     border-left: solid 1px #80d0f3;
}
 .nav-fixed .natrus {
     border-right: none;
}
 .nav-fixed .inquiry, .nav-fixed .network {
     border-right: 1px solid #FAD273;
}
 .nav-fixed .network {
     border-right: none;
}
 .nav-fixed ul li a {
     display: block;
     width: 100%;
     min-height: 60px;
     font-size: 18px;
     color: #ffffff;
     line-height: 22px;
     text-align: center;
}
 .nav-fixed ul li a span {
     position: relative;
     display: -moz-inline-stack;
     display: inline-block;
     vertical-align: middle;
     *vertical-align: auto;
     zoom: 1;
     *display: inline;
     margin-top: 20px;
     padding-left: 31px;
}
 .nav-fixed span::before {
     content: "";
     display: block;
     position: absolute;
     background-repeat: no-repeat;
     background-size: contain;
     left: 0;
     height: 100%;
     background-position: center;
}
 .nav-fixed #natrus {
     padding-left: 61px;
}
 .nav-fixed #natrus::before {
     width: 51px;
     background-image: url(../images/nav-fixed-natrus.svg);
}
 .nav-fixed ul li a span svg, .nav-fixed ul li a span div {
     position: absolute !important;
     left: 0px !important;
     top: 50% !important;
}
 .nav-fixed .inquiry, .nav-fixed .network {
     border-right: 1px solid #FAD273;
}
 .nav-fixed .inquiry a, .nav-fixed .network a {
     background-color: #f8b417;
}
 /* .nav-fixed svg {
     transform: translateY(-50%);
} */
 .nav-fixed #inquiry {
     padding-left: 36px;
}
 .nav-fixed #inquiry::before {
     width: 26px;
     background-image: url(../images//nav-fixed-inquiry.svg);
}
 .nav-fixed #network::before {
     width: 21px;
     background-image: url(../images//nav-fixed-network.svg);
}
 .nav-fixed .network {
     border-right: none;
}
 .nav-fixed a {
     transition: 0s;
}
 .nav-fixed ul li a:hover {
     background-color: #f8b417;
}
 .nav-fixed .inquiry a:hover span, .nav-fixed .network a:hover span {
     opacity: 0.7;
}
 @media print, screen and (min-width: 768px) and (max-width: 1024px) {
     .nav-fixed ul {
         width: 100%;
    }
     .nav-fixed ul li {
         width: 25%;
         box-sizing: border-box;
    }
     .nav-fixed ul li a {
         font-size: 1.7578125vw;
         width: 100%;
    }
     .nav-fixed ul li a span {
         padding-left: 3.02734375vw;
    }
}
 @media print, screen and (max-width: 767.98px) {
     .nav-fixed {
         display: none!important;
         background-color: #FAD273;
    }
     .nav-fixed .products-all, .nav-fixed .natrus {
         display: none;
    }
     .nav-fixed .inquiry, .nav-fixed .network {
         width: 50%;
         box-sizing: border-box;
    }
     .nav-fixed ul {
         width: 100%;
    }
     .nav-fixed ul li a {
         width: 100%;
    }
     .nav-fixed .inquiry a, .nav-fixed .network a {
         width: 100%;
         font-size: 13px;
         opacity: 1;
         transition: 0.3s;
    }
}
 @media screen and (max-width: 350px) {
     .nav-fixed .inquiry a, .nav-fixed .network a {
         font-size: 12px;
    }
}
 main {
    /*padding-top:92px;
    */
}
 main img {
     width: 100%;
     height: auto;
     display: block;
     image-rendering: -webkit-optimize-contrast;
}
 main sup {
     vertical-align: super;
     font-size: 0.5em;
}
 main .text {
     font-size: 1.8rem;
     line-height: 2.2;
}
 main .main-text {
     text-align: center;
     font-size: 1.8rem;
     line-height: 2.5;
     padding: 4.5rem 0;
}
 main .main-text span {
     font-family: AxisStd-Bold;
     color: #00A0E6;
     display: inline-block;
}
 main .btn-wrap a {
     font-family: AxisStd-Medium;
     border-radius: 1rem;
     background-color: #00A0E6;
     color: #FFF;
     text-align: center;
     margin-left: auto;
     margin-right: auto;
     display: block;
     max-width: 439px;
     font-size: 1.8rem;
     padding: 2.5rem 1rem;
     padding-right: 2em;
     position: relative;
     transition: .3s;
}
 main .btn-wrap a:after {
     line-height: 1;
     content: "▼";
    /*content: url("../images/btn-arrow.svg");
    */
     top: 50%;
    /*transform: translateY(-50%);
    */
     transform: rotate(-90deg) translateX(-50%);
     transform-origin: 0% 0%;
     right: 1rem;
     position: absolute;
     font-size: 10px;
}
 main .btn-wrap a:hover {
     background-color: #F8B417;
}
 main .mainread {
     overflow: hidden;
     background-color: #F8FFEF;
}
 main .mainread .mainread-btm {
     position: relative;
}
 main .mainread .mainread-btm .mainread-btm-img {
     width: 170%;
     position: relative;
     left: 50%;
     transform: translateX(-50%);
}
 main .mainread .mainread-btm .mainread-txt {
     position: absolute;
     color: #00A496;
     font-size: 3.2rem;
     font-family: AxisStd-Medium;
     text-align: center;
     left: 50%;
     transform: translateX(-50%);
     width: 100%;
     top: 17%;
}
 main .mainread .mainread-btm .bal {
     position: absolute;
     width: 13.07457%;
}
 main .mainread .mainread-btm .bal01 {
     top: 42.8%;
     left: 1.9%;
}
 main .mainread .mainread-btm .bal02 {
     top: 36.1%;
     left: 17.8%;
}
 main .mainread .mainread-btm .bal03 {
     top: 29.1%;
     left: 35.1%;
}
 main .mainread .mainread-btm .bal04 {
     top: 50.2%;
     left: 27.6%;
}
 main .mainread .mainread-btm .bal05 {
     top: 39.7%;
     left: 49%;
}
 main .mainread .mainread-btm .bal06 {
     top: 34.1%;
     left: 66.1%;
}
 main .mainread .mainread-btm .bal07 {
     top: 51.9%;
     left: 62.1%;
}
 main .mainread .mainread-btm .bal08 {
     top: 41%;
     left: 82%;
}
 main .mainread .main-btm-btm-text {
     font-family: AxisStd-Medium;
     text-align: center;
     color: #00A496;
     font-size: 3.2rem;
     position: relative;
     margin: 4.5rem 0;
}
 main .komari-wrap {
     position: relative;
     padding-bottom: 8.5rem;
     padding-top: 8.5rem;
}
 main .komari-wrap .next-line-wrap {
     position: absolute;
     transform: translateX(-50%);
     top: -30px;
     left: 50%;
}
 main .komari-wrap .next-line-wrap .next-line {
     width: 2px;
     height: 13rem;
     background-color: #00A496;
     position: relative;
}
 main .komari-wrap .next-line-wrap .next-line:after {
     content: "";
     display: block;
     background-color: #00A496;
     height: 1rem;
     width: 1rem;
     bottom: 0;
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
     border-radius: 1rem;
}
 main .komari-wrap .komari {
     padding-top: 12rem;
     padding-bottom: 12rem;
     position: relative;
}
 main .komari-wrap .komari::after {
     content: "";
     position: absolute;
     left: 0;
     bottom: 0;
     width: 100%;
     height: 1px;
     margin: auto;
     background-image: linear-gradient(to right, #000, #000 5px, transparent 5px, transparent 10px);
     background-size: 10px 1px;
     background-repeat: repeat-x;
}
 main .komari-wrap .komari .komari-title {
     margin-bottom: 4rem;
     color: #333333;
     font-family: AxisStd-Medium;
     text-align: center;
     font-size: 3.2rem;
}
 main .komari-wrap .komari .kata-wrap {
     flex-wrap: wrap;
}
 main .komari-wrap .komari .kata-wrap .kata-item {
     margin-bottom: 1rem;
     width: 23.49336057201226%;
     background-color: #F8FFEF;
     text-align: center;
     color: #00A496;
     border-radius: 1rem;
     display: flex;
     flex-direction: column;
     padding: 2rem 1rem;
}
 main .komari-wrap .komari .kata-wrap .kata-item .kata-title {
     font-family: AxisStd-bold;
     font-size: 2rem;
     margin-bottom: 2rem;
    /*height: 5em;
    */
     flex: 1 0 auto;
     display: flex;
     justify-content: center;
     align-items: center;
}
 main .komari-wrap .komari .kata-wrap .kata-item .kata-title.w80 {
     max-width: 168px;
     margin-left: auto;
     margin-right: auto;
}
 main .komari-wrap .komari .kata-wrap .kata-item .kata-icon-wrap {
     justify-content: center;
}
 main .komari-wrap .komari .kata-wrap .kata-item .kata-icon-wrap .kata-icon + .kata-icon {
     margin-left: 1rem;
}
 main .komari-wrap .komari .kata-wrap .kata-item .kata-txt {
     height: 3em;
     font-size: 1.6rem;
     display: flex;
     margin-top: 1rem;
     justify-content: center;
     align-items: center;
}
 main .komari-wrap .komari .exp-wrap {
     margin-top: 5rem;
}
 main .komari-wrap .komari .exp-wrap .exp-name {
     color: #00A0E6;
     font-family: AxisStd-Bold;
     font-size: 4.2rem;
}
 main .komari-wrap .komari .exp-wrap .orange {
     background-color: #F8B417;
     color: #FFF;
     font-size: 2.1rem;
     text-align: center;
     border-radius: 0.5rem;
     margin-top: 0.3em;
}
 main .komari-wrap .komari .exp-wrap .exp-name-wrap {
     justify-content: flex-start;
     flex-wrap: wrap;
     margin-bottom: 1.5rem;
}
 main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name-left {
     margin-right: 3%;
     margin-bottom: 1.5rem;
     width: auto;
}
 main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name-right {
     width: auto;
     color: #00A0E6;
     font-size: 1.7rem;
}
 main .komari-wrap .komari .exp-wrap .exp-left {
     width: 49%;
}
 main .komari-wrap .komari .exp-wrap .exp-right {
     width: 43.7%;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap {
     margin-bottom: 3rem;
     max-width: 395px;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap .ill-left, main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap .ill-right {
     width: 41.3%;
     display: flex;
     flex-direction: column;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap .ill-arrow {
     display: flex;
     align-items: center;
     width: 4%;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap .ill-title {
     font-family: AxisStd-Medium;
     font-size: 1.8rem;
     flex: 1 0 auto;
     text-align: center;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-wrap .ill-right .ill-title {
     color: #00A0E6;
}
 main .komari-wrap .komari .exp-wrap .exp-right .ill-txt {
     font-size: 1.4rem;
     line-height: 1.8;
}
 main .komari-wrap .komari .coment {
     line-height: 2;
     font-size: 1.2rem;
     text-indent: -1em;
     margin-left: 1em;
     margin-top: 4rem;
}
 main .komari-wrap .komari .exp-btm-wrap {
     max-width: 911px;
     margin-top: 10rem;
     margin-bottom: 6.5rem;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-left {
     width: 61.36%;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right {
     width: 33%;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap {
     cursor: pointer;
     max-width: 276px;
     margin-left: auto;
     margin-right: auto;
     margin-top: 12.6%;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap .movie-coment {
     font-size: 1.6rem;
     text-align: center;
     margin-top: 0.5rem;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap a {
     display: block;
     overflow: hidden;
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap a img {
     transition: -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1), -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap a img:hover {
     -webkit-transform: scale(1.02);
     transform: scale(1.02);
}
 main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap .into-movie {
     display: none;
}
 main .komari-wrap .komari .exp-btm-wrap .good-design-wrap {
     margin-bottom: 39%;
}
 main .komari-wrap .komari .exp-btm-wrap .good-design-wrap .img-box {
     max-width: 193px;
}
 main .komari-wrap .komari .exp-btm-wrap .good-design-wrap .coment {
     margin: 0;
     font-family: AxisStd-Medium;
     font-size: 1.6rem;
     margin-top: 1em;
     text-indent: 0;
}
 main .komari-wrap .komari .coments-wrap {
     margin-top: 10rem;
     border-radius: 1rem;
     padding: 6rem 1rem;
     text-align: center;
     background-color: #F8FFEF;
     line-height: 2;
     font-size: 1.8rem;
}
 main .komari-wrap .komari .coments-wrap .coments-inner {
     max-width: 810px;
     margin: 0 auto;
}
 main .komari-wrap .komari .coments-wrap .coments-inner .comtnts-com {
     font-size: 0.77em;
     margin-top: 3.5rem;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap .img-box {
     width: 100%;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap .coment {
     font-size: 1.6rem;
     margin: 0;
     margin-top: 1em;
     text-indent: 0;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap {
     margin-top: 9rem;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item {
     display: flex;
     flex-direction: column;
     width: 30%;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item .img-box {
     max-width: 236px;
     margin-left: auto;
     margin-right: auto;
     margin-bottom: 1.7rem;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item .features-title {
     margin-bottom: 2rem;
     font-family: AxisStd-Medium;
     font-size: 2rem;
     color: #FFF;
     background-color: #00A0E6;
     border-radius: 1em;
     text-align: center;
     padding: 0.1em 1em;
     display: flex;
     justify-content: center;
     align-self: center;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item .features-txt {
     text-align: center;
     font-size: 1.4rem;
     line-height: 1.7;
}
 main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item:last-child {
     width: 32%;
}
 main .komari-wrap #komari-jidou.komari .kata-wrap {
     justify-content: center;
}
 main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item {
    /*width: 100%;
    */
     margin-right: 1.5rem;
}
 main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .kata-title {
     flex-grow: 0;
}
 main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .kata-txt {
     height: auto;
     margin-top: 2rem;
}
 main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item:last-child {
     margin-right: 0;
}
 main .komari-wrap #komari-jidou.komari .link-wrap {
     max-width: 870px;
     margin-left: auto;
     margin-right: auto;
     margin-top: 13rem;
}
 main .komari-wrap #komari-jidou.komari .link-wrap .link-title {
     font-family: AxisStd-Medium;
     color: #00A0E6;
     font-size: 2.2rem;
     line-height: 2;
}
 main .komari-wrap #komari-jidou.komari .link-wrap .btn-wrap {
     width: 34.48%;
}
 main .komari-wrap #komari-jidou.komari .link-wrap .link-txt {
     font-size: 1.8rem;
     line-height: 2;
     max-width: 690px;
}
 main .komari-wrap #komari-jidou.komari .link-wrap .coment {
     margin: 0;
     text-indent: 0;
}
 main .komari-wrap #komari-jidou.komari .link-wrap .flexbox {
     align-items: center;
}
 main .komari-wrap #komari-jidou.komari .link-wrap.flexbox {
     align-items: center;
}
 main .komari-wrap #komari-jidou.komari .link-wrap.flexbox .link-title {
     width: 57.4%;
}
 main .komari-wrap #komari-jidou.komari .link-wrap.pro-hikido .link-title {
     margin-bottom: 2rem;
}
 main .komari-wrap #komari-jidou.komari .link-wrap.pro-hikido .flexbox {
     margin-top: 2rem;
}
 main .komari-wrap .komari:last-child:after {
     content: none;
}
 main .komari-wrap .komari:last-child {
     padding-bottom: 0;
}
 main .school {
     background-color: #E8FBFD;
     padding: 12rem 7px;
     overflow: hidden;
}
 main .school .base-width {
     position: relative;
     max-width: 1142px;
}
 main .school .base-width:after, main .school .base-width:before {
     content: url(../images/bg_dot.png);
     display: block;
     position: absolute;
}
 main .school .base-width:before {
     top: -60px;
     left: -210px;
}
 main .school .base-width:after {
     bottom: -100px;
     right: -250px;
}
 main .school .school-inner {
     z-index: 1;
     position: relative;
}
 main .school .school-inner .school-title-wrap {
     display: flex;
     justify-content: center;
     margin-bottom: 4rem;
}
 main .school .school-inner .school-title {
     font-size: 2.8rem;
     font-family: AxisStd-Medium;
     position: relative;
     padding: 1.5rem 2rem;
     border-bottom: 2px solid #00A0E6;
}
 main .school .school-inner .school-title:before {
     position: absolute;
     bottom: -14px;
     left: 50%;
     transform: translateX(-50%);
     width: 0;
     height: 0;
     content: '';
     border-width: 14px 12px 0;
     border-style: solid;
     border-color: #00A0E6 transparent transparent;
}
 main .school .school-inner .school-title:after {
     position: absolute;
     bottom: -10px;
     left: 50%;
     transform: translateX(-50%);
     width: 0;
     height: 0;
     content: '';
     border-width: 14px 12px 0;
     border-style: solid;
     border-color: #E8FBFD transparent transparent;
}
 main .school .school-inner .flexbox {
     flex-direction: row-reverse;
}
 main .school .school-inner .flexbox .txt-box {
     border-top-right-radius: 1rem;
     border-bottom-right-radius: 1rem;
     background-color: #FFF;
     width: 76.7%;
     padding: 5rem 8rem;
     padding-left: 14%;
     font-size: 1.8rem;
     line-height: 2;
}
 main .school .school-inner .flexbox .txt-box .coment {
     font-size: 1.4rem;
     margin-top: 4.6rem;
}
 main .school .school-inner .flexbox .txt-box .coment a {
     overflow-wrap: break-word;
}
 main .school .school-inner .flexbox .txt-box a.link-school:hover {
     opacity: 0.5;
}
 main .school .school-inner .flexbox .img-box {
     margin-top: 5rem;
     transform: scale(1.5);
     transform-origin: top left;
     width: 23.3%;
}
 .modal-wrap {
     display: none;
     top: 0;
     z-index: 99999;
     position: fixed;
     width: 100vw;
     height: 100vh;
     background: rgba(0, 0, 0, 0.7);
    /*opacity: 0.7;
    */
}
 .modal-wrap .modal-box-outer {
     position: relative;
     width: 100vw;
     height: 100vh;
}
 .modal-wrap .modal-box-wrap {
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     background-color: transparent;
}
 .modal-wrap .modal-box-wrap .modal-box {
     position: relative;
     max-width: 90vw;
     width: 800px;
     height: auto;
}
 .modal-wrap .modal-box-wrap .modal-box .btn-movie-close {
     position: absolute;
     bottom: calc(100% + 10px);
     right: 0;
     width: 10%;
     max-width: 48px;
     cursor: pointer;
}
 .modal-wrap .modal-box-wrap .modal-box .into-movie {
     position: relative;
     width: 100%;
     padding-top: 56.25%;
}
 .modal-wrap .modal-box-wrap .modal-box .into-movie iframe {
     position: absolute;
     top: 0;
     right: 0;
     width: 100%;
     height: 100%;
}
/*pc*/
 @media screen and (min-width: 768px) {
     .komari-wrap .komari .coments-wrap .coments-txt {
        /*word-break: keep-all;
        */
    }
}
 @media print, screen and (min-width: 768px) and (max-width: 979px) {
     main .mainread .mainread-btm .mainread-txt {
         font-size: 3.2vw;
    }
}
/*sp*/
 @media print, screen and (max-width: 767.98px) {
     main .text {
         font-size: 14px;
    }
     main .main-text {
        /*font-size: 2.4vw;
        */
         font-size: 14px;
         padding: 4.5vw 0;
    }
     main .mainread .mainread-btm .mainread-txt {
         font-size: 3.65vw;
         top: 11%;
    }
     main .mainread .main-btm-btm-text {
        /*font-size: 3.65vw;
        */
         font-size: 22px;
        /*margin: 6.5vw 0;
        */
         margin: 40px 0;
    }
     main .btn-wrap a {
         font-size: 14px;
    }
     main .komari-wrap {
         padding-top: 6rem;
    }
     main .komari-wrap .komari {
         padding-top: 6rem;
         padding-bottom: 6rem;
         margin-left: auto;
         margin-right: auto;
         max-width: 610px;
    }
     main .komari-wrap .komari .komari-title {
         font-size: 22px;
    }
     main .komari-wrap .komari .coment {
         font-size: 10px;
         margin-top: 2.5rem;
    }
     main .komari-wrap .komari .kata-wrap {
         max-width: 610px;
         margin-right: auto;
         margin-left: auto;
    }
     main .komari-wrap .komari .kata-wrap .kata-item {
         width: 49%;
    }
     main .komari-wrap .komari .kata-wrap .kata-item .kata-title {
         font-size: 17px;
    }
     main .komari-wrap .komari .kata-wrap .kata-item .kata-title.w80 {
         max-width: none;
    }
     main .komari-wrap .komari .kata-wrap .kata-item .kata-txt {
         font-size: 14px;
    }
     main .komari-wrap .komari .exp-wrap {
         display: block;
    }
     main .komari-wrap .komari .exp-wrap .exp-left, main .komari-wrap .komari .exp-wrap .exp-right {
         width: 100%;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap {
         justify-content: center;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name-left {
         width: auto;
         margin-right: 5%;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name-right {
         width: auto;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name {
         font-size: 30px;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap .orange {
         font-size: 16px;
         display: inline-block;
         padding-left: 0.5em;
         padding-right: 0.5em;
    }
     main .komari-wrap .komari .exp-wrap .exp-name-wrap .exp-name-right {
         font-size: 16px;
    }
     main .komari-wrap .komari .exp-wrap .exp-left .sp-img-wrap {
         margin-bottom: 2.5rem;
        /*max-width: 610px;
        */
         align-items: center;
        /* margin-right: auto;
         margin-left: auto;
        */
    }
     main .komari-wrap .komari .exp-wrap .exp-left .sp-img-wrap .img-box:first-child {
         width: 53.3%;
    }
     main .komari-wrap .komari .exp-wrap .exp-left .sp-img-wrap .img-box:last-child {
         width: 46.7%;
    }
     main .komari-wrap .komari .exp-wrap .exp-left .sp-img-wrap .img-box:last-child img {
         transform: scale(1.1);
         transform-origin: right center;
    }
     main .komari-wrap .komari .exp-wrap.sp-exp .exp-right .ill-wrap {
         max-width: none;
    }
     main .komari-wrap .komari .exp-wrap.sp-exp .exp-right .ill-wrap .ill-title {
         font-size: 17px;
         width: 110%;
    }
     main .komari-wrap .komari .exp-wrap.sp-exp .exp-right .ill-wrap .ill-right .ill-title {
         margin-left: -10%;
    }
     main .komari-wrap .komari .exp-wrap.sp-exp .exp-right .ill-txt {
         font-size: 14px;
         text-align: center;
    }
     main .komari-wrap .komari .exp-btm-wrap {
         margin-top: 7rem;
         margin-bottom: 0rem;
    }
     main .komari-wrap .komari .exp-btm-wrap .exp-btm-right {
         width: 100%;
         flex-wrap: wrap;
         justify-content: space-around;
         align-items: center;
         margin-bottom: -3rem;
         display: flex;
    }
     main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap {
         cursor: pointer;
         margin-bottom: 3rem;
        /*margin-right: 2%;
        */
         margin-right: 0%;
         margin-left: 0;
         margin-top: 0;
         padding: 0 1%;
    }
     main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap .into-movie {
         display: none;
    }
     main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .movie-wrap .movie-coment {
         font-size: 14px;
    }
     main .komari-wrap .komari .exp-btm-wrap .exp-btm-right .btn-wrap {
         margin-bottom: 3rem;
    }
     main .komari-wrap .komari .coments-wrap {
         padding: 3rem 3rem;
         font-size: 14px;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .img-box:first-child {
         width: 70%;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap {
         width: 30%;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap .img-box {
         width: 100%;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap .img-box img {
         transform: none;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-wrap .exp-left .sp-img-wrap .good-design-wrap .coment {
         font-family: AxisStd-Medium;
         font-size: 10px;
         margin: 0;
         margin-top: 1em;
         text-indent: 0;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap {
         margin-top: 3rem;
         flex-direction: column;
         align-items: center;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item {
         width: auto;
         max-width: 600px;
         margin-bottom: 5rem;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item .features-title {
         font-size: 20px;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item .features-txt {
         font-size: 14px;
    }
     main .komari-wrap #barrierfree-toilet.komari .exp-md-wrap .features-item:last-child {
         margin-bottom: 0;
         width: auto;
    }
     main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item {
         align-items: center;
         max-width: 380px;
         width: 100%;
         margin-right: 0;
         justify-content: center;
         flex-direction: row;
         padding: 2rem;
    }
     main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .img-box:first-child {
         width: 25%;
         margin-right: 5%;
    }
     main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .txt-cont {
         text-align: left;
         width: 70%;
    }
     main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .txt-cont .kata-title {
         justify-content: flex-start;
         margin-bottom: 1rem;
    }
     main .komari-wrap #komari-jidou.komari .kata-wrap .kata-item .txt-cont .kata-txt {
         margin-top: 0;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap {
         margin-top: 10vw;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap .flexbox {
         flex-direction: column;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap .flexbox .coment {
         align-self: flex-end;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap .link-title {
         font-size: 17px;
         width: 100%;
         text-align: center;
         margin-bottom: 2rem;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap .link-txt {
         font-size: 14px;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap .btn-wrap {
         margin-top: 2vw;
         min-width: 300px;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap.pro-hikido {
         margin-top: 16vw;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap.flexbox {
         flex-direction: column;
    }
     main .komari-wrap #komari-jidou.komari .link-wrap.flexbox .link-title {
         width: 100%;
         text-align: center;
    }
     main .school {
         padding-top: 6rem;
         padding-bottom: 6rem;
    }
     main .school .base-width:before {
         top: 80px;
         left: -50px;
    }
     main .school .base-width:after {
         bottom: -40px;
         right: -70px;
    }
     main .school .school-inner .school-title {
         font-size: 20px;
    }
     main .school .school-inner .flexbox {
         align-items: center;
         flex-direction: column-reverse;
    }
     main .school .school-inner .flexbox .txt-box {
         font-size: 14px;
         width: 100%;
         max-width: 700px;
         padding: 3rem;
         padding-top: 10rem;
         margin-top: -8rem;
    }
     main .school .school-inner .flexbox .txt-box .coment {
         font-size: 10px;
         margin-top: 2.6rem;
    }
     main .school .school-inner .flexbox .img-box {
         align-self: center;
         width: 85%;
         max-width: 400px;
         margin: 0;
         transform: none;
    }
}
/* movie */
 .movie-box .inner-movie-box {
     display: flex;
     justify-content: center;
     align-items: center;
}
 .movie-box .movie-thumb {
     height: auto;
}
 .movie-box .movie-thumb a {
     display: block;
     position: relative;
     width: 288px;
     height: 216px;
     z-index: 1;
     overflow: hidden;
     margin: 0 auto 10px;
}
 .movie-box .movie-thumb a::after {
     content: '';
     display: block;
     position: absolute;
     bottom: 14px;
     right: 14px;
     z-index: 1;
     width: 28px;
     height: 28px;
     background: url(/en/assets/before-data/wp-content/themes/nabtesco/img/top/icn_play.png) no-repeat 0 0;
     background-size: contain;
}
 .movie-box .movie-thumb a .movie-thumb-playimg {
     display: block;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     transition: -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
     transition: transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1), -webkit-transform 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
}
 .movie-box .movie-thumb a .movie-thumb-playimg::before {
     display: block;
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.2);
     z-index: 2;
     transition: background-color 0.5s cubic-bezier(0.2, 0.675, 0.626, 1);
}
/* modal */
 .movie-modal-box {
     position: fixed;
     left: 50%;
     top: 50%;
     -webkit-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
     padding: 0 68px;
     background-color: transparent;
     z-index: 210;
}
 .movie-modal-box .btn-movie-close {
     position: absolute;
     top: 0;
     right: 0;
     width: 48px;
     height: 48px;
     cursor: pointer;
     z-index: 110;
}
 .movie-modal-box .btn-movie-close {
     display: none;
}
 .movie-modal-box .youtube-load {
     width: 800px;
     height: 450px;
     position: relative;
     z-index: 3;
}
 .movie-modal-box__inner {
     width: 800px;
     height: 650px;
     background-color: #fff;
}
 @media screen and (max-width: 767px){
     .movie-modal-box {
         width: 100%;
         height: auto;
         padding: 0 20px;
    }
     .movie-modal-box .movie-modal-box__inner {
         width: 100%;
         height: auto;
    }
     .movie-modal-box .btn-movie-close {
         right: 20px;
         top: -30px;
         -webkit-transform: translateX(-100%);
         transform: translateX(-100%);
         width: 20px;
         height: 20px;
    }
     .movie-modal-box .btn-movie-close svg {
         -webkit-transform: scale(0.5);
         transform: scale(0.5);
    }
     .movie-modal-box .youtube-load {
         width: 100%;
         height: auto;
    }
     .movie-modal-box .youtube-load iframe {
         width: 100%;
         height: calc(100vw * 0.55);
    }
}
 @media screen and (min-width: 768px){
     .movie-box .movie-thumb a:hover .movie-thumb-playimg {
         -webkit-transform: scale(1.05);
         transform: scale(1.05);
    }
     .movie-box .movie-thumb a:hover .movie-thumb-playimg::before {
         background-color: rgba(0, 0, 0, 0);
    }
     .movie-box .movie-thumb a:hover::before {
         background-color: rgba(0, 0, 0, 0);
         -webkit-transform: translate(12%, 12%);
         transform: translate(12%, 12%);
    }
}
 .page-loader, .inform-modal {
     display: none;
}