@charset  "UTF-8";

embed,img,object {
    vertical-align: top;
}

body,caption,th {
    text-align: left;
}

.showFablet,.showJsOn,.showNarrow,.showSP,.showTablet,legend {
    display: none;
}

#container,body,html {
    height: 100%;
}

#logo a,.row {
    overflow: hidden;
}

html {
    overflow-y: scroll;
}

address,article,aside,blockquote,body,dd,div,dl,dt,fieldset,figcaption,figure,form,h1,h2,h3,h4,h5,h6,header,input,nav,p,pre,section,td,textarea,th,ul,ul li {
    margin: 0;
    padding: 0;
    line-height: 180%;
}

address,caption,cite,code,dfn,em,strong,th,var {
    font-style: normal;
    font-weight: 400;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

q:after,q:before {
    content: '';
}

h1,h2,h3,h4,h5,h6 {
    font-size: 100%;
    font-weight: 400;
}

abbr,acronym,fieldset,img {
    border: 0;
}

img {
    max-width: 100%;
    height: auto;
    -ms-interpolation-mode: bicubic;
}

ul li {
    list-style-type: none;
}

*,:after,:before {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-family: '游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    color: #707070;
    line-height: 160%;
    background-color: #111213;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -o-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

#loader2,#pageTitle .btn a,.center,.img,.mainvisual1,.mainvisual1 h1 {
    text-align: center;
}

a {
    outline: 0;
}

.sp a:active,.sp a:hover,a:link,a:visited {
    text-decoration: none;
    color: #0090d4;
}

.pc a:active,.pc a:hover {
    text-decoration: underline;
    color: #1ab6ff;
}

@font-face {
    font-family: 'Noto Sans Japanese';
    src: url(/common/fonts/NotoSansJP-Light-sub.eot);
    src: url(/common/fonts/NotoSansJP-Light-sub.eot?#iefix) format("embedded-opentype"),url(/common/fonts/NotoSansJP-Light-sub.woff) format("woff");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url(/common/fonts/OpenSans-Light.eot);
    src: url(/common/fonts/OpenSans-Light.eot?#iefix) format("embedded-opentype"),url(/common/fonts/OpenSans-Light.woff) format("woff"),url(/common/fonts/OpenSans-Light.ttf) format("truetype");
    font-weight: 300;
    font-style: normal;
}

.col {
    float: left;
}

.half {
    width: 50%;
}

.oneThird {
    width: 33.33333333%;
}

.twoThird {
    width: 66.66666666%;
}

.quarter {
    width: 25%;
}

.threeQuarters {
    width: 75%;
}

#container,.img img {
    width: 100%;
}

.half.gutter:first-of-type {
    padding-right: 10px;
}

.half.gutter:last-of-type {
    padding-left: 10px;
}

.oneThird.gutter:first-of-type {
    padding-right: 13.33px;
}

.oneThird.gutter:nth-of-type(2) {
    padding-left: 6.67px;
    padding-right: 6.67px;
}

.oneThird.gutter:last-of-type {
    padding-left: 13.33px;
}

#tagline,.right {
    text-align: right;
}

.js .showJsOn {
    display: block;
}

.js br.showJsOn {
    display: inline;
}

strong {
    color: #000;
    font-weight: 700;
}

em {
    color: #d7277a;
}

#logo a:link,#logo a:visited,#tagline,.sp #logo a:active,.sp #logo a:hover {
    color: #fff;
}

.large {
    font-size: 100% !important;
}

.small {
    font-size: 76% !important;
}

dl .large,ol .large,td .large,ul .large {
    font-size: 110% !important;
}

dl .small,ol .small,td .small,ul .small {
    font-size: 83% !important;
}

#container {
    position: relative;
    max-width: 1240px;
    /*max-width: 1600px;*/
    margin: 0 auto;
    padding: 0 0 0 0;
    /*padding: 0 40px 0 120px;*/
}

#tagline {
    position: absolute;
    z-index: 5;
    height: 40px;
    right: 40px;
    padding: 12px 0 0;
    font-size: 60%;
}

header {
    position: fixed;
    z-index: 3;
    top: 40px;
    background-color: #0090d4;
}

#logo {
    width: 190px;
}

#logo a {
    position: relative;
    display: block;
    height: 190px;
    padding: 50px 0 0 22px;
    transition: box-shadow .3s linear;
}

.pc #logo a:active,.pc #logo a:hover {
    color: #fff;
    text-decoration: none;
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.pc #logo a:before {
    content: "";
    position: absolute;
    display: block;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #10a7ee;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc #logo a:hover:before {
    left: 140%;
}

#logo p {
    position: relative;
    margin: 0 0 23px;
}

@media screen and (min-width:980px) {
    #mainNav>li>a,#subNav a {
        text-align: center;
        overflow: hidden;
    }

    #mainNav>li>a:link,#mainNav>li>a:visited,#mainNav>li>ul>li>a:link,#mainNav>li>ul>li>a:visited,#mainNav>li>ul>li>ul>li>a:link,#mainNav>li>ul>li>ul>li>a:visited,.sp #mainNav>li>a:active,.sp #mainNav>li>a:hover,.sp #mainNav>li>ul>li>a:active,.sp #mainNav>li>ul>li>a:hover,.sp #mainNav>li>ul>li>ul>li>a:active,.sp #mainNav>li>ul>li>ul>li>a:hover {
        color: #bbb;
    }

    #mainNav>li>ul,#mainNav>li>ul>li>ul {
        height: 100%;
        -webkit-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        top: 0;
    }

    #mainNav>li>a:after,#mainNav>li>a:before,#mainNav>li>ul>li>a:before,#mainNav>li>ul>li>ul>li>a:before {
        content: "";
    }

    #mainNav .spLocalNavBtn,#spGnavBtn,#spGnavCover {
        display: none;
    }

    #gnav {
        position: fixed;
        z-index: 1000;
        height: 100%;
        top: 0;
        margin: 0 0 0 -120px;
    }

    #mainNav,#subNav {
        position: absolute;
        height: 100%;
        top: 0;
        left: 0;
    }

    #mainNav>li>a {
        position: absolute;
        display: block;
        width: 80px;
        height: 70px;
        padding: 40px 0 0;
        font-size: 67%;
        -moz-transition: color .2s linear;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        -ms-transition: color .2s linear;
        transition: color .2s linear;
    }

    #mainNav>li:nth-of-type(1)>a {
        top: 0;
    }

    #mainNav>li:nth-of-type(2)>a {
        top: 70px;
    }

    #mainNav>li:nth-of-type(3)>a {
        top: 140px;
    }

    #mainNav>li:nth-of-type(4)>a {
        top: 210px;
    }

    #mainNav>li:nth-of-type(5)>a {
        top: 280px;
    }

    #mainNav>li:nth-of-type(6)>a {
        top: 350px;
    }

    #mainNav>li:last-of-type>a {
        bottom: 0;
    }

    .pc #mainNav>li:hover>a,.pc #mainNav>li>a:active,.pc #mainNav>li>a:hover {
        color: #fff;
        text-decoration: none;
    }

    #mainNav #gnavContact>a {
        background-color: #dd3ca2;
    }

    #mainNav #gnavContact>a:link,#mainNav #gnavContact>a:visited,.sp #mainNav #gnavContact>a:active,.sp #mainNav #gnavContact>a:hover {
        color: #f8d8ec;
    }

    #mainNav #gnavContact.current>a,.pc #mainNav #gnavContact>a:active,.pc #mainNav #gnavContact>a:hover {
        color: #fff !important;
    }

    #mainNav>li>a:after {
        position: absolute;
        width: 40px;
        height: 40px;
        top: 5px;
        left: 20px;
        background-image: url(../images/icon.png);
        background-repeat: no-repeat;
        -moz-background-size: 420px 940px;
        -webkit-background-size: 420px 940px;
        -o-background-size: 420px 940px;
        -ms-background-size: 420px 940px;
        background-size: 420px 940px;
        -moz-transition: opacity .2s linear;
        -webkit-transition: opacity .2s linear;
        -o-transition: opacity .2s linear;
        -ms-transition: opacity .2s linear;
        transition: opacity .2s linear;
    }

    #gnavService>a:after {
        background-position: -40px 0;
    }

    #gnavPortfolio>a:after {
        background-position: -80px 0;
    }

    #gnavCompany>a:after {
        background-position: -120px 0;
    }

    #gnavRecruit>a:after {
        background-position: -160px 0;
    }

    #gnavColumn>a:after {
        background-position: -200px 0;
    }

    #gnavContact>a:after {
        background-position: -240px 0;
    }

    #mainNav>li>a:link:after,#mainNav>li>a:visited:after,.sp #mainNav>li>a:active:after,.sp #mainNav>li>a:hover:after {
        opacity: .7;
    }

    #mainNav>li.current>a:after,#mainNav>li.parent>a:after,.pc #mainNav>li:hover>a:after,.pc #mainNav>li>a:active:after,.pc #mainNav>li>a:hover:after {
        opacity: 1;
    }

    #mainNav #gnavContact>a:link:after,#mainNav #gnavContact>a:visited:after,.sp #mainNav #gnavContact>a:active:after,.sp #mainNav #gnavContact>a:hover:after {
        opacity: .8;
    }

    #mainNav #gnavContact.current>a:after,.pc #mainNav #gnavContact>a:active:after,.pc #mainNav #gnavContact>a:hover:after {
        opacity: 1;
    }

    #mainNav>li>a>span {
        position: relative;
    }

    #mainNav>li>a:before {
        position: absolute;
        display: block;
        width: 130%;
        height: 100%;
        top: 0;
        left: 10%;
        background-color: #0090d4;
        opacity: .3;
        -moz-transform: translateX(-120%) skewX(15deg);
        -webkit-transform: translateX(-120%) skewX(15deg);
        -o-transform: translateX(-120%) skewX(15deg);
        -ms-transform: translateX(-120%) skewX(15deg);
        transform: translateX(-120%) skewX(15deg);
        -moz-transition: left .2s ease-in-out,opacity .2s linear;
        -webkit-transition: left .2s ease-in-out,opacity .2s linear;
        -o-transition: left .2s ease-in-out,opacity .2s linear;
        -ms-transition: left .2s ease-in-out,opacity .2s linear;
        transition: left .2s ease-in-out,opacity .2s linear;
    }

    #mainNav>li.current>a:before,.pc #mainNav>li>a:hover:before {
        left: 140%;
        opacity: 1;
    }

    #mainNav>li:hover>a:link,#mainNav>li:hover>a:visited,.sp #mainNav>li:hover>a:active,.sp #mainNav>li:hover>a:hover {
        background-color: #252829;
    }

    .pc #mainNav>li:hover>a:active,.pc #mainNav>li:hover>a:hover {
        background-color: #111213;
    }

    #mainNav>li.current>a,#mainNav>li.parent>a {
        color: #fff;
    }

    #mainNav #gnavContact>a:before {
        background-color: #f95dc0;
    }

    #mainNav>li {
        position: absolute;
        z-index: 1;
        height: 100%;
        top: 0;
        left: 0;
        -moz-perspective: 1000px;
        -webkit-perspective: 1000px;
        -o-perspective: 1000px;
        -ms-perspective: 1000px;
        perspective: 1000px;
        -moz-transform-style: preserve-3d;
        -webkit-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }

    #mainNav>li.hover {
        z-index: 2;
    }

    #mainNav>li>ul {
        position: absolute;
        display: none\9;
        width: 240px;
        left: 80px;
        background-color: #252829;
        -moz-transform: rotateY(95deg);
        -webkit-transform: rotateY(95deg);
        -o-transform: rotateY(95deg);
        -ms-transform: rotateY(95deg);
        transform: rotateY(95deg);
        -moz-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        transform-origin: 0 0;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        backface-visibility: hidden;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    #mainNav.localNavOpen>li>ul {
        -moz-transform: rotateY(0);
        -webkit-transform: rotateY(0);
        -o-transform: rotateY(0);
        -ms-transform: rotateY(0);
        transform: rotateY(0);
    }

    #mainNav>li.hover>ul>li {
        display: block;
    }

    #mainNav>li>ul>li {
        position: absolute;
        z-index: 1;
        display: none;
        height: 100%;
        top: 0;
        -moz-perspective: 1000px;
        -webkit-perspective: 1000px;
        -o-perspective: 1000px;
        -ms-perspective: 1000px;
        perspective: 1000px;
        -moz-transform-style: preserve-3d;
        -webkit-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }

    #mainNav>li>ul>li.hover {
        z-index: 2;
    }

    #mainNav>li>ul>li>a {
        position: absolute;
        display: block;
        width: 240px;
        left: 0;
        padding: 0 15px;
        font-size: 76%;
        line-height: 55px;
        overflow: hidden;
        -moz-transition: color .2s linear;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        -ms-transition: color .2s linear;
        transition: color .2s linear;
    }

    .pc #mainNav>li>ul>li:hover>a,.pc #mainNav>li>ul>li>a:active,.pc #mainNav>li>ul>li>a:hover {
        color: #fff;
        text-decoration: none;
    }

    #mainNav>li>ul>li:nth-of-type(1)>a {
        top: 0;
    }

    #mainNav>li>ul>li:nth-of-type(2)>a {
        top: 55px;
    }

    #mainNav>li>ul>li:nth-of-type(3)>a {
        top: 110px;
    }

    #mainNav>li>ul>li:nth-of-type(4)>a {
        top: 165px;
    }

    #mainNav>li>ul>li:nth-of-type(5)>a {
        top: 220px;
    }

    #mainNav>li>ul>li:nth-of-type(6)>a {
        top: 275px;
    }

    #mainNav>li>ul>li:nth-of-type(7)>a {
        top: 330px;
    }

    #mainNav>li>ul>li:nth-of-type(8)>a {
        top: 385px;
    }

    #mainNav>li>ul>li:nth-of-type(9)>a {
        top: 440px;
    }

    #mainNav>li>ul>li:nth-of-type(10)>a {
        top: 495px;
    }

    #mainNav>li:hover>ul>li>a>span {
        position: relative;
    }

    #mainNav>li>ul>li>a:before {
        position: absolute;
        display: block;
        width: 130%;
        height: 100%;
        top: 0;
        left: 10%;
        background-color: #0090d4;
        opacity: .3;
        -moz-transform: translateX(-120%) skewX(15deg);
        -webkit-transform: translateX(-120%) skewX(15deg);
        -o-transform: translateX(-120%) skewX(15deg);
        -ms-transform: translateX(-120%) skewX(15deg);
        transform: translateX(-120%) skewX(15deg);
        -moz-transition: left .2s ease-in-out,opacity .2s linear;
        -webkit-transition: left .2s ease-in-out,opacity .2s linear;
        -o-transition: left .2s ease-in-out,opacity .2s linear;
        -ms-transition: left .2s ease-in-out,opacity .2s linear;
        transition: left .2s ease-in-out,opacity .2s linear;
    }

    #mainNav>li>ul>li.current>a:before,.pc #mainNav>li>ul>li>a:hover:before {
        left: 140%;
        opacity: 1;
    }

    #mainNav>li>ul>li:hover>a:link,#mainNav>li>ul>li:hover>a:visited,.sp #mainNav>li>ul>li:hover>a:active,.sp #mainNav>li>ul>li:hover>a:hover {
        background-color: #333739;
    }

    .pc #mainNav>li>ul>li:hover>a:active,.pc #mainNav>li>ul>li:hover>a:hover {
        background-color: #252829;
    }

    #mainNav>li>ul>li.current>a,#mainNav>li>ul>li.parent>a {
        color: #fff;
    }

    #mainNav>li>ul>li>ul {
        position: absolute;
        width: 240px;
        left: 240px;
        background-color: #333739;
        -moz-transform: rotateY(95deg);
        -webkit-transform: rotateY(95deg);
        -o-transform: rotateY(95deg);
        -ms-transform: rotateY(95deg);
        transform: rotateY(95deg);
        -moz-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        transform-origin: 0 0;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        backface-visibility: hidden;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    #mainNav>li>.localNavOpen>li>ul {
        -moz-transform: rotateY(0);
        -webkit-transform: rotateY(0);
        -o-transform: rotateY(0);
        -ms-transform: rotateY(0);
        transform: rotateY(0);
    }

    #mainNav>li>ul>li>ul>li {
        display: none;
    }

    #mainNav>li>ul>li.hover>ul>li {
        display: block;
    }

    #mainNav>li>ul>li>ul>li>a {
        position: relative;
        display: block;
        width: 240px;
        left: 0;
        padding: 0 15px;
        font-size: 76%;
        line-height: 55px;
        overflow: hidden;
        -moz-transition: color .2s linear;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        -ms-transition: color .2s linear;
        transition: color .2s linear;
    }

    .pc #mainNav>li>ul>li>ul>li>a:active,.pc #mainNav>li>ul>li>ul>li>a:hover {
        color: #fff;
        text-decoration: none;
    }

    #mainNav>li:hover>ul>li>ul>li>a>span {
        position: relative;
    }

    #mainNav>li>ul>li>ul>li>a:before {
        position: absolute;
        display: block;
        width: 130%;
        height: 101%;
        top: 0;
        left: 10%;
        background-color: #0090d4;
        opacity: .3;
        -moz-transform: translateX(-120%) skewX(15deg);
        -webkit-transform: translateX(-120%) skewX(15deg);
        -o-transform: translateX(-120%) skewX(15deg);
        -ms-transform: translateX(-120%) skewX(15deg);
        transform: translateX(-120%) skewX(15deg);
        -moz-transition: left .2s ease-in-out,opacity .2s linear;
        -webkit-transition: left .2s ease-in-out,opacity .2s linear;
        -o-transition: left .2s ease-in-out,opacity .2s linear;
        -ms-transition: left .2s ease-in-out,opacity .2s linear;
        transition: left .2s ease-in-out,opacity .2s linear;
    }

    #mainNav>li>ul>li>ul>li.current>a:before,.pc #mainNav>li>ul>li>ul>li>a:hover:before {
        left: 140%;
        opacity: 1;
    }

    #mainNav>li>ul>li>ul>li.current>a,#mainNav>li>ul>li>ul>li.parent>a {
        color: #fff;
    }

    #subNav a {
        position: absolute;
        display: block;
        width: 36px;
        height: 36px;
        left: 22px;
        border: 1px solid rgba(255,255,255,.7);
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        -moz-transition: color .2s linear,background-color .2s,linear;
        -webkit-transition: color .2s linear,background-color .2s,linear;
        -o-transition: color .2s linear,background-color .2s,linear;
        -ms-transition: color .2s linear,background-color .2s,linear;
        transition: color .2s linear,background-color .2s,linear;
    }

    #subNavNews a {
        bottom: 142px;
    }

    #subNavNews a:before {
        content: "NEWS";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 10px;
        line-height: 34px;
    }

    #subNavEnglish a {
        bottom: 90px;
    }

    #subNavEnglish a:before {
        content: "ACT";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 12px;
        line-height: 34px;
    }

    #subNav a:link,#subNav a:visited,.sp #subNav a:active,.sp #subNav a:hover {
        color: #bbb;
    }

    .pc #subNav a:active,.pc #subNav a:hover {
        color: #111213;
        text-decoration: none;
        background-color: #fff;
    }

    #subNav a span {
        display: block;
        text-indent: -9999px;
        overflow: hidden;
    }
}

#loader2 span:after,#loader2 span:before,html.next #contents,html.prev #contents {
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
}

#loader2:before,#pageTitle>div:before {
    float: left;
    display: block;
    /*width: 0;*/
    /*width: 60%;*/
    margin: 0 0 0 0;
    content: "";
    /*max-width: 0;*/
}
#pageTitle>div:before {
    /*width: 0;*/
    /*max-width: 0;*/
    margin: 0 0 0 0;
}

#bgImg,#bgImgDummy,#pageTitle {
    position: fixed;
    width: 100%;
    max-width: 1240px;
    /*max-width: 1600px;*/
    height: 100%;
    top: 0;
    /*margin: 0 0 0 0;*/
    margin: 0 0 0 0;
    /*padding: 0 0 0 0;*/
    padding: 0 80px 0 0;
    /*padding: 0 0 0 80px;*/
    overflow: hidden;
}
#bgImg2,#bgImgDummy,#pageTitle {
    position: fixed;
    width: 100%;
    max-width: 1240px;
    /*max-width: 1600px;*/
    height: 100%;
    top: 0;
    /*margin: 0 0 0 0;*/
    margin: 0 0 0 0;
    /*padding: 0 0 0 0;*/
    padding: 0 80px 0 0;
    /*padding: 0 0 0 80px;*/
    overflow: hidden;
    z-index: 2;
    /*background-image: url(../img/header/pattern.png);*/
    /*background-repeat: repeat;*/
}
#pageTitle {
    position: fixed;
    width: 35%;
    max-width: 522px;
    /*max-width: 1600px;*/
    height: 100%;
    top: 0;
	left:60%;
    /*margin: 0 0 0 0;*/
    margin: 0 0 0 0;
    /*padding: 0 0 0 0;*/
    padding: 0 0 0 0;
    /*padding: 0 0 0 80px;*/
    overflow: hidden;
}


#bgImg .img,#bgImgDummy .img {
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
}

.fadeOut #bgImgDummy .img {
    opacity: 0;
    -moz-transition: opacity .3s linear .3s;
    -webkit-transition: opacity .3s linear .3s;
    -o-transition: opacity .3s linear .3s;
    -ms-transition: opacity .3s linear .3s;
    transition: opacity .3s linear .3s;
}

#pageTitle {
    /*z-index: 6;*/
	z-index: 2;
	float:left;
	/*float:right;*/
	/*margin: 0 0 0 60%;*/
}

#pageTitle>div {
    /*position: relative;*/
    height: 100%;
    /*padding: 0 0;*/
	/*margin-left:20px;*/
	padding-left:20px;
	padding-right:40px;
    /*padding: 0 40px;*/
}

#pageTitle>div:before {
    height: 100%;
}

#loader2 {
    position: absolute;
    width: 100%;
    top: 45%;
    left: -30px;
    padding: 0 40px;
    opacity: 0;
}

#loader2:before {
    height: 80px;
}

html.next #loader2,html.prev #loader2 {
    opacity: 1;
    -moz-transform: translate3d(30px,0,0);
    -webkit-transform: translate3d(30px,0,0);
    -o-transform: translate3d(30px,0,0);
    -ms-transform: translate3d(30px,0,0);
    transform: translate3d(30px,0,0);
    -moz-transition: -moz-transform .3s ease-out,opacity .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out,opacity .3s ease-out;
    -o-transition: -o-transform .3s ease-out,opacity .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out,opacity .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out;
}

html.next.fadeOut #loader2,html.prev.fadeOut #loader2 {
    opacity: 0;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -moz-transition: -moz-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -webkit-transition: -webkit-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -o-transition: -o-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -ms-transition: -ms-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    transition: transform .3s ease-out .2s,opacity .3s ease-out .2s;
}

#loader2 span {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 80px;
    -moz-perspective: 500px;
    -webkit-perspective: 500px;
    -o-perspective: 500px;
    -ms-perspective: 500px;
    perspective: 500px;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

#loader2 span:after,#loader2 span:before {
    content: "";
    position: absolute;
    display: block;
    width: 60px;
    height: 60px;
    top: 10px;
    left: 10px;
    background-image: url(../images/logo.svgz);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 44px 9px;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

html.next #contents,html.prev #contents {
    -webkit-backface-visibility: hidden;
    overflow: hidden;
}

#loader2 span:before {
    -moz-transform-origin: right top;
    -webkit-transform-origin: right top;
    -o-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -moz-animation: loader1 .3s linear infinite normal;
    -webkit-animation: loader1 .3s linear infinite normal;
    -o-animation: loader1 .3s linear infinite normal;
    -ms-animation: loader1 .3s linear infinite normal;
    animation: loader1 .3s linear infinite normal;
}

@-moz-keyframes loader1 {
    0% {
        background-color: #007bb5;
        -moz-transform: translate3d(-60px,0,0) rotateY(-90deg);
    }

    100% {
        background-color: #0090d4;
        -moz-transform: translate3d(0,0,0) rotateY(0);
    }
}

@-webkit-keyframes loader1 {
    0% {
        background-color: #007bb5;
        -webkit-transform: translate3d(-60px,0,0) rotateY(-90deg);
    }

    100% {
        background-color: #0090d4;
        -webkit-transform: translate3d(0,0,0) rotateY(0);
    }
}

@-o-keyframes loader1 {
    0% {
        background-color: #007bb5;
        -o-transform: translate3d(-60px,0,0) rotateY(-90deg);
    }

    100% {
        background-color: #0090d4;
        -o-transform: translate3d(0,0,0) rotateY(0);
    }
}

@-ms-keyframes loader1 {
    0% {
        background-color: #007bb5;
        -ms-transform: translate3d(-60px,0,0) rotateY(-90deg);
    }

    100% {
        background-color: #0090d4;
        -ms-transform: translate3d(0,0,0) rotateY(0);
    }
}

@keyframes loader1 {
    0% {
        background-color: #007bb5;
        transform: translate3d(-60px,0,0) rotateY(-90deg);
    }

    100% {
        background-color: #0090d4;
        transform: translate3d(0,0,0) rotateY(0);
    }
}

#loader2 span:after {
    -moz-transform-origin: left top;
    -webkit-transform-origin: left top;
    -o-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -moz-animation: loader2 .3s linear infinite normal;
    -webkit-animation: loader2 .3s linear infinite normal;
    -o-animation: loader2 .3s linear infinite normal;
    -ms-animation: loader2 .3s linear infinite normal;
    animation: loader2 .3s linear infinite normal;
}

@-moz-keyframes loader2 {
    0% {
        background-color: #0090d4;
        -moz-transform: translate3d(0,0,0) rotateY(0);
    }

    100% {
        background-color: #10a7ee;
        -moz-transform: translate3d(60px,0,0) rotateY(90deg);
    }
}

@-webkit-keyframes loader2 {
    0% {
        background-color: #0090d4;
        -webkit-transform: translate3d(0,0,0) rotateY(0);
    }

    100% {
        background-color: #10a7ee;
        -webkit-transform: translate3d(60px,0,0) rotateY(90deg);
    }
}

@-o-keyframes loader2 {
    0% {
        background-color: #0090d4;
        -o-transform: translate3d(0,0,0) rotateY(0);
    }

    100% {
        background-color: #10a7ee;
        -o-transform: translate3d(60px,0,0) rotateY(90deg);
    }
}

@-ms-keyframes loader2 {
    0% {
        background-color: #0090d4;
        -ms-transform: translate3d(0,0,0) rotateY(0);
    }

    100% {
        background-color: #10a7ee;
        -ms-transform: translate3d(60px,0,0) rotateY(90deg);
    }
}

@keyframes loader2 {
    0% {
        background-color: #0090d4;
        transform: translate3d(0,0,0) rotateY(0);
    }

    100% {
        background-color: #10a7ee;
        transform: translate3d(60px,0,0) rotateY(90deg);
    }
}

#pageTitle .textArea {
    position: relative;
    top: 42%;
    /*right: 30px;*/
	max-width:400px;
    left: 0;
    color: #fff;
    text-align: left;
    opacity: 1;
}

html.next #pageTitle .textArea,html.prev #pageTitle .textArea {
    opacity: 0;
    -moz-transform: translate3d(30px,0,0);
    -webkit-transform: translate3d(30px,0,0);
    -o-transform: translate3d(30px,0,0);
    -ms-transform: translate3d(30px,0,0);
    transform: translate3d(30px,0,0);
    -moz-transition: -moz-transform .3s ease-out,opacity .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out,opacity .3s ease-out;
    -o-transition: -o-transform .3s ease-out,opacity .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out,opacity .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out;
}

html.next.fadeOut #pageTitle .textArea,html.prev.fadeOut #pageTitle .textArea {
    opacity: 1;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -moz-transition: -moz-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -webkit-transition: -webkit-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -o-transition: -o-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    -ms-transition: -ms-transform .3s ease-out .2s,opacity .3s ease-out .2s;
    transition: transform .3s ease-out .2s,opacity .3s ease-out .2s;
}

#pageTitle .text {
    margin: 0 0 20px;
}

#pageTitle .copy,#pageTitle h1 {
    margin: 0 0 20px;
    line-height: 140%;
    font-size: 180%;
}

#pageTitle .copy strong {
    font-weight: 400;
    color: #fff;
}

#pageTitle .list {
    margin: 0 0 25px;
}

#pageTitle .list li {
    position: relative;
    font-size: 90%;
    margin: 0 0 5px;
    overflow: hidden;
}

#pageTitle .list li q {
    position: relative;
    float: left;
    display: block;
    padding: 0 20px;
}

#pageTitle .list li q:after,#pageTitle .list li q:before {
    position: absolute;
    display: block;
    width: 15px;
    height: 20px;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 30px;
    overflow: hidden;
    opacity: .5;
}

#pageTitle .list li q:before {
    content: '\“';
    top: 0;
    left: 0;
}

#pageTitle .list li q:after {
    content: '\”';
    bottom: -10px;
    right: 0;
}

#pageTitle .btn a:before,.pc #pageTitle .btn:before {
    content: "";
    height: 100%;
}

#pageTitle .btn {
    position: relative;
    display: inline-block;
    font-size: 90%;
    overflow: hidden;
}

.pc #pageTitle .btn:before {
    position: absolute;
    display: block;
    width: 120%;
    top: 0;
    left: 20%;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out .1s,background-color .1s linear .1s;
    -webkit-transition: left .2s ease-in-out .1s,background-color .1s linear .1s;
    -o-transition: left .2s ease-in-out .1s,background-color .1s linear .1s;
    -ms-transition: left .2s ease-in-out .1s,background-color .1s linear .1s;
    transition: left .2s ease-in-out .1s,background-color .1s linear .1s;
}

.pc #pageTitle .btn:hover:before {
    left: 130%;
    background-color: #fff;
}

#pageTitle .btn a {
    position: relative;
    display: block;
    min-width: 250px;
}

#pageTitle .btn a:link,#pageTitle .btn a:visited,.sp #pageTitle .btn a:active,.sp #pageTitle .btn a:hover {
    color: #fff;
}

.pc #pageTitle .btn a:active,.pc #pageTitle .btn a:hover {
    color: #000;
    text-decoration: none;
}

#pageTitle .btn a:before {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    border: 2px solid #fff;
    opacity: .4;
}

#pageTitle .btnText {
    position: relative;
    display: block;
    padding: 12px 35px 12px 25px;
    transition: color .2s linear .1s;
}

#pageTitle .btnText:after,.pc #pageTitle .btnBorderBottom,.pc #pageTitle .btnBorderLeft,.pc #pageTitle .btnBorderRight,.pc #pageTitle .btnBorderTop {
    position: absolute;
    display: block;
    content: "";
}

#pageTitle .btnText:after {
    width: 8px;
    height: 8px;
    top: 50%;
    margin: -4px 0 0;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: border .2s linear .1s,right .2s linear .1s;
    -webkit-transition: border .2s linear .1s,right .2s linear .1s;
    -o-transition: border .2s linear .1s,right .2s linear .1s;
    -ms-transition: border .2s linear .1s,right .2s linear .1s;
    transition: border .2s linear .1s,right .2s linear .1s;
}

#pageTitle .btn a:link .btnText:after,#pageTitle .btn a:visited .btnText:after,.sp #pageTitle .btn a:active .btnText:after,.sp #pageTitle .btn a:hover .btnText:after {
    right: 15px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
}

.pc #pageTitle .btn a:active .btnText:after,.pc #pageTitle .btn a:hover .btnText:after {
    right: 12px;
    border-right: solid 1px #000;
    border-bottom: solid 1px #000;
}

.pc #pageTitle .btnBorderTop {
    width: 0;
    height: 2px;
    top: 0;
    left: 0;
    background-color: #fff;
    -moz-transition: width .2s linear;
    -webkit-transition: width .2s linear;
    -o-transition: width .2s linear;
    -ms-transition: width .2s linear;
    transition: width .2s linear;
}

.pc #pageTitle .btnBorderRight {
    width: 2px;
    height: 0;
    top: 0;
    right: 0;
    background-color: #fff;
    -moz-transition: height .2s linear;
    -webkit-transition: height .2s linear;
    -o-transition: height .2s linear;
    -ms-transition: height .2s linear;
    transition: height .2s linear;
}

.pc #pageTitle .btnBorderBottom {
    width: 0;
    height: 2px;
    bottom: 0;
    right: 0;
    background-color: #fff;
    -moz-transition: width .2s linear;
    -webkit-transition: width .2s linear;
    -o-transition: width .2s linear;
    -ms-transition: width .2s linear;
    transition: width .2s linear;
}

.pc #pageTitle .btnBorderLeft {
    width: 2px;
    height: 0;
    bottom: 0;
    left: 0;
    background-color: #fff;
    -moz-transition: height .2s linear;
    -webkit-transition: height .2s linear;
    -o-transition: height .2s linear;
    -ms-transition: height .2s linear;
    transition: height .2s linear;
}

#breadCrumb2 li:first-of-type:before,#cover,html.next footer,html.prev footer {
    display: none;
}

.pc #pageTitle .btn a:hover .btnBorderBottom,.pc #pageTitle .btn a:hover .btnBorderTop {
    width: 100%;
}

.pc #pageTitle .btn a:hover .btnBorderLeft,.pc #pageTitle .btn a:hover .btnBorderRight {
    height: 100%;
}

#pageTitle .btn,#pageTitle .copy,#pageTitle .list li,#pageTitle .text,#pageTitle h1 {
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
}
#pageTitle .text,#pageTitle h1 {
	color:#333333;
	font-weight:bold;
}

#breadCrumb2 {
    overflow: hidden;
    padding: 0 0 20px;
	color:#333333;
}

#breadCrumb2 li {
    float: left;
	font-size: 80%;
	font-weight:bold;
    /*font-size: 67%;*/
	color:#333333;
}

#breadCrumb2 li:before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 10px;
    border-top: solid 1px #333333;
    border-right: solid 1px #333333;
	border-color:#333333;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: .5;
}

#breadCrumb2 a:link,#breadCrumb2 a:visited,.sp #breadCrumb2 a:active,.sp #breadCrumb2 a:hover {
    color: #333333;
    text-decoration: none;
    opacity: 1;
    /*opacity: .7;*/
}

.pc #breadCrumb2 a:active,.pc #breadCrumb2 a:hover {
    color: #fff;
    text-decoration: none;
    opacity: 1;
}

#breadCrumb2 li:first-of-type a {
    display: block;
    /*
	width: 16px;
    height: 16px;
    */
	overflow: hidden;
    /*
	text-indent: -9999px;
    background-image: url(img/icon.png);
    background-repeat: no-repeat;
    background-position: right top;
	*/
	color:#333333;
    -moz-background-size: 420px 940px;
    -webkit-background-size: 420px 940px;
    -o-background-size: 420px 940px;
    -ms-background-size: 420px 940px;
    background-size: 420px 940px;
}

.listBox5 .img,.mainvisual1 .bg {
    background-size: cover;
    background-repeat: no-repeat;
}

html.next body,html.prev body {
    overflow: hidden;
}
#container2{
	/*float:left;*/
}
#container2:after {
    content: "";
    display: block;
    clear: both;
}

#contentsArea {
    /*position: relative;*/
	float:left;
    z-index: 4;
    width: 60%;
    max-width: 800px;
    min-height: 100%;
    margin: 0 5px 0 0;
    /*margin: 0 auto 0 0;*/
    /*margin: 0 0 0 auto;*/
    padding: 40px 0;
}

html.next #contentsArea,html.prev #contentsArea {
    height: 100%;
    -moz-perspective: 3000px;
    -webkit-perspective: 3000px;
    -o-perspective: 3000px;
    -ms-perspective: 3000px;
    perspective: 3000px;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

#contents {
    position: relative;
	margin-top:40px;
    z-index: 8;
}

html.next #contents {
    width: 50%;
    top: 0;
    left: 0;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform-origin: right top;
    -webkit-transform-origin: right top;
    -o-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -moz-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

html.next #contents>.inner {
    position: relative;
    width: 200%;
    top: 0;
    left: 0;
}

html.prev #contents {
    width: 50%;
    top: 0;
    left: 50%;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform-origin: left top;
    -webkit-transform-origin: left top;
    -o-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -moz-transform: rotateY(-180deg);
    -webkit-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}

#contentsDummy1,.listBox4 .hide {
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
}

html.prev #contents>.inner {
    position: relative;
    width: 200%;
    top: 0;
    left: -100%;
}

html.fadeOut #contents {
    -moz-transform: rotateY(0);
    -webkit-transform: rotateY(0);
    -o-transform: rotateY(0);
    -ms-transform: rotateY(0);
    transform: rotateY(0);
    -moz-transition: -moz-transform .6s ease-in-out;
    -webkit-transition: -webkit-transform .6s ease-in-out;
    -o-transition: -o-transform .6s ease-in-out;
    -ms-transition: -ms-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
}

#contentsDummy1 {
    position: absolute;
    z-index: 6;
    top: 40px;
    overflow: hidden;
    backface-visibility: hidden;
    -moz-transition: -moz-transform .6s ease-in-out;
    -webkit-transition: -webkit-transform .6s ease-in-out;
    -o-transition: -o-transform .6s ease-in-out;
    -ms-transition: -ms-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
}

html.next #contentsDummy1 {
    width: 50%;
    left: 50%;
    -moz-transform-origin: left top;
    -webkit-transform-origin: left top;
    -o-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

html.next #contentsDummy1>.inner {
    position: relative;
    width: 200%;
    top: 0;
    left: -100%;
}

html.next.fadeOut #contentsDummy1 {
    -moz-transform: rotateY(-180deg);
    -webkit-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}

html.prev #contentsDummy1 {
    width: 50%;
    left: 0;
    -moz-transform-origin: right top;
    -webkit-transform-origin: right top;
    -o-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
}

html.chrome.prev #contentsDummy1 {
    width: 100%;
    transform-origin: center top;
}

html.prev #contentsDummy1>.inner {
    position: relative;
    width: 200%;
    top: 0;
    left: 0;
}

html.chrome.prev #contentsDummy1>.inner {
    position: static;
    width: 100%;
}

html.prev.fadeOut #contentsDummy1 {
    -moz-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

html.chrome.prev.fadeOut #contentsDummy1 {
    transition: transform .3s ease-in;
}

#contentsDummy2 {
    position: absolute;
    z-index: 7;
    width: 100%;
    height: 100%;
    top: 40px;
    overflow: hidden;
}

html.fadeOut #contentsDummy2 {
    width: 50%;
}

html.next.fadeOut #contentsDummy2 {
    left: 0;
}

html.prev.fadeOut #contentsDummy2 {
    right: 0;
}

html.fadeOut #contentsDummy2>.inner {
    position: relative;
    width: 200%;
    top: 0;
}

html.next.fadeOut #contentsDummy2>.inner {
    left: 0;
}

html.prev.fadeOut #contentsDummy2>.inner {
    left: -100%;
}

#contentsDummy3 {
    position: absolute;
    z-index: 5;
    width: 50%;
    height: 100%;
    top: 40px;
    overflow: hidden;
}

html.next #contentsDummy3 {
    right: 0;
}

html.prev #contentsDummy3 {
    left: 0;
}

#contentsDummy3>.inner {
    position: relative;
    width: 200%;
    top: 0;
}

#cover,.mainvisual1 .bg {
    width: 100%;
    height: 100%;
    top: 0;
}

html.next.fadeOut #contentsDummy3>.inner {
    left: -100%;
}

#cover,html.prev.fadeOut #contentsDummy3>.inner {
    left: 0;
}

#cover {
    position: fixed;
    z-index: 10000;
}

html.fadeIn #cover,html.fadeOut #cover {
    display: block;
}

html.fadeOut #contentsArea {
    height: 100%;
}

html.fadeOut #contents,html.fadeOut #contentsDummy1,html.fadeOut #contentsDummy2,html.fadeOut #contentsDummy3 {
    height: 100%;
    padding: 0 0 40px;
    background-color: #fff;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -o-box-sizing: content-box;
    -ms-box-sizing: content-box;
    box-sizing: content-box;
}

.contentsBox {
    padding: 40px 8% 20px;
    background-color: #fff;
}

.contentsBox.gray {
    background-color: #f1f5f8;
}

.contentsBox.black {
    background-color: #333739;
}

.contentsBox.blue {
    background-color: #588fe3;
}

.contentsBox.skyBlue {
    background-color: #3aaade;
}

.contentsBox.lightBlue {
    background-color: #27c0dc;
}

.contentsBox.blueGreen {
    background-color: #02aa9f;
}

.contentsBox.green {
    background-color: #219e62;
}

.contentsBox:after {
    content: "";
    display: block;
    clear: both;
}

#privacy h3,.contentsBox>h1,.contentsBox>h2,.listBox2>h2,.listBox4>h2,.listBox5>h2 {
    padding: 40px 0;
    font-size: 150%;
    line-height: 140%;
    color: #000;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    text-align: center;
}

.contentsBox>h1 .sub,.contentsBox>h2 .sub,.listBox4>h2 .sub {
    display: block;
    font-size: 60%;
    line-height: 140%;
    color: #999;
}

.contentsBox>h1,.contentsBox>h2:first-of-type {
    padding: 0 0 40px;
}

.contentsBox>h1 .sub {
    padding: 10px 0 0;
}

.contentsBox>h3 {
    padding: 10px 0;
    font-weight: 700;
    color: #000;
}

.contentsBox>h2+h3 {
    padding: 0 0 10px;
}

.contentsBox p {
    max-width: 720px;
    margin: 0 auto;
    padding: 0 0 20px;
    font-size: 90%;
}

.contentsBox.black dd,.contentsBox.black dt,.contentsBox.black em,.contentsBox.black li,.contentsBox.black p,.contentsBox.black>h2,.contentsBox.black>h2 .sub,.contentsBox.black>h3,.contentsBox.blue dd,.contentsBox.blue dt,.contentsBox.blue em,.contentsBox.blue li,.contentsBox.blue p,.contentsBox.blue>h2,.contentsBox.blue>h2 .sub,.contentsBox.blue>h3,.contentsBox.blueGreen dd,.contentsBox.blueGreen dt,.contentsBox.blueGreen em,.contentsBox.blueGreen li,.contentsBox.blueGreen p,.contentsBox.blueGreen>h2,.contentsBox.blueGreen>h2 .sub,.contentsBox.blueGreen>h3,.contentsBox.green dd,.contentsBox.green dt,.contentsBox.green em,.contentsBox.green li,.contentsBox.green p,.contentsBox.green>h2,.contentsBox.green>h2 .sub,.contentsBox.lightBlue dd,.contentsBox.lightBlue dt,.contentsBox.lightBlue em,.contentsBox.lightBlue li,.contentsBox.lightBlue p,.contentsBox.lightBlue>h2,.contentsBox.lightBlue>h2 .sub,.contentsBox.lightBlue>h3,.contentsBox.skyBlue dd,.contentsBox.skyBlue dt,.contentsBox.skyBlue em,.contentsBox.skyBlue li,.contentsBox.skyBlue p,.contentsBox.skyBlue>h2,.contentsBox.skyBlue>h2 .sub,.contentsBox.skyBlue>h3 {
    color: #fff;
}

.mainvisual1 {
    position: relative;
    padding: 40px 8%;
}

.mainvisual1.blue {
    background-color: #588fe3;
}

.mainvisual1.skyBlue {
    background-color: #3aaade;
}

.mainvisual1.lightBlue {
    background-color: #27c0dc;
}

.mainvisual1 .bg {
    position: absolute;
    left: 0;
    background-position: center center;
    opacity: .07;
}

.mainvisual1 .img {
    position: relative;
    display: inline-block;
    width: 150px;
    height: 150px;
    margin: 0 0 20px;
    overflow: hidden;
    -moz-border-radius: 75px;
    -webkit-border-radius: 75px;
    -o-border-radius: 75px;
    -ms-border-radius: 75px;
    border-radius: 75px;
}

.mainvisual1 img {
    position: absolute;
    display: block;
    width: 243px;
    max-width: none;
    height: 150px;
    top: 0;
    left: 50%;
    margin: 0 0 0 -121px;
}

.mainvisual1 h1 {
    position: relative;
    margin: 0 0 20px;
    color: #fff;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 140%;
    line-height: 160%;
}

.mainvisual1 .sub {
    margin: 0 15px 0 0;
    color: #fff;
    font-size: 60%;
    line-height: 160%;
    vertical-align: middle;
}

.mainvisual1 .text {
    position: relative;
    color: #fff;
    font-size: 90%;
    text-align: left;
}

.mainvisual2 section {
    float: none;
    width: 100%;
    background-color: #fff;
    overflow: hidden;
}

.mainvisual2 .imgArea {
    float: left;
    position: relative;
    width: 66.666666%;
    background-color: #000;
    overflow: hidden;
}

.mainvisual2 .imgArea .img {
    height: 18.5em;
    background-repeat: no-repeat;
    background-position: center center;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
}

.mainvisual2 .textArea {
    float: right;
    position: relative;
    width: 33.333333%;
    height: 18.5em;
    padding: 30px 3.33333333% 0;
    text-align: center;
}

.mainvisual2 h1 {
    position: relative;
    display: table-cell;
    width: 500px;
    height: 45px;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 90%;
    color: #000;
    line-height: 130%;
    vertical-align: middle;
}

.mainvisual2 section h1:after,.mainvisual2 section h1:before {
    content: "";
    position: absolute;
    display: block;
    width: 100px;
    height: 1px;
    left: 50%;
    margin: 0 0 0 -50px;
    background-color: #000;
}

.mainvisual .img,.mainvisual .text {
    display: inline-block;
    vertical-align: middle;
}

.mainvisual2 section h1:before {
    top: 0;
}

.mainvisual2 section h1:after {
    bottom: 0;
}

.mainvisual2 .logo {
    padding: 0 0 10px;
    font-size: 76%;
}

.mainvisual2 .text {
    padding: 15px 0 0;
    font-size: 76%;
}

.mainvisual {
    background-color: #333739;
}

.mainvisual .img {
    width: 50%;
}

.mainvisual img {
    width: 100%;
}

.mainvisual .text {
    width: 48%;
    padding: 0 5%;
    color: #fff;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 140%;
    text-align: center;
    line-height: 160%;
}

.mainvisual .sub {
    display: block;
    color: #aaa;
    font-size: 60%;
    line-height: 160%;
}

.contentsBox dl {
    font-size: 90%;
}

.contentsBox li dl,.contentsBox table dl {
    padding: 0;
    font-size: 100%;
}

.contentsBox dt {
    color: #000;
    font-weight: 700;
}

.contentsBox dd {
    padding: 0 0 20px;
}

.contentsBox table dl:last-child dd:last-child {
    padding: 0;
}

.contentsBox dd+dd {
    margin-top: -20px;
}

.contentsBox .marginSet dd+dd,.holizontal dd+dd {
    margin-top: 0;
}

.holizontal {
    padding: 0 0 20px;
    overflow: hidden;
}

.holizontal dt {
    clear: both;
    float: left;
    color: #707070;
    font-weight: 400;
}

.holizontal.w3em dt {
    width: 3em;
}

.holizontal.w4em dt {
    width: 4em;
}

.holizontal.w5em dt {
    width: 5em;
}

.holizontal.w6em dt {
    width: 6em;
}

.holizontal.w7em dt {
    width: 7em;
}

.holizontal.w8em dt {
    width: 8em;
}

.holizontal.w9em dt {
    width: 9em;
}

.holizontal.banner dt {
    width: 160px;
}

.holizontal dd {
    padding: 0;
    overflow: hidden;
}

.holizontal dd:last-of-type {
    padding: 0;
}

.holizontal.w3em dd {
    margin-left: 3em;
}

.holizontal.w4em dd {
    margin-left: 4em;
}

.holizontal.w5em dd {
    margin-left: 5em;
}

.holizontal.w6em dd {
    margin-left: 6em;
}

.holizontal.w7em dd {
    margin-left: 7em;
}

.holizontal.w8em dd {
    margin-left: 8em;
}

.holizontal.w9em dd {
    margin-left: 9em;
}

.holizontal.banner dd {
    margin-left: 160px;
}

.faqList dt {
    position: relative;
    margin: 0 0 10px 50px;
}

.faqList dd {
    position: relative;
    margin: 0 0 0 50px;
}

.faqList dd:after,.faqList dt:after {
    position: absolute;
    display: block;
    width: 38px;
    height: 38px;
    top: -5px;
    left: -50px;
    padding: 3px 0 0;
    font-family: Open Sans,Arial,Helvetica,sans-serif;
    text-align: center;
    background-image: url(/common/images/icon.png);
    background-repeat: no-repeat;
    background-position: -361px -1px;
    background-size: 420px 940px;
}

.faqList dt:after {
    content: "Q";
    color: #fff;
    background-color: #3aaade;
}

.faqList dd:after {
    content: "A";
    color: #3aaade;
    background-color: #fff;
}

.faqList dd+dd:after {
    display: none;
}

.contentsBox hr:after,.contentsBox ul li:after {
    content: "";
    display: block;
}

.contentsBox ul {
    font-size: 90%;
    padding: 0 0 20px;
}

.contentsBox dd ul,.contentsBox ol ul,.contentsBox table ul,.contentsBox ul ul {
    font-size: 100%;
    padding: 0;
}

.contentsBox ul.marginSet {
    padding-bottom: 0;
}

.contentsBox ul li {
    position: relative;
    padding: 0 0 0 1.2em;
}

.contentsBox ul li:after {
    position: absolute;
    width: 4px;
    height: 4px;
    top: .6em;
    left: .3em;
    background-color: #999;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -o-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
}

.contentsBox.black ul li:after,.contentsBox.blue ul li:after,.contentsBox.blueGreen ul li:after,.contentsBox.green ul li:after,.contentsBox.lightBlue ul li:after,.contentsBox.skyBlue ul li:after {
    background-color: #fff;
}

.contentsBox ul.marginSet>li {
    padding-bottom: 20px;
}

.contentsBox .serviceList {
    overflow: hidden;
    padding-bottom: 0;
}

.contentsBox .serviceList li {
    float: left;
    width: 33.33333333%;
    padding-bottom: 10px;
}

.contentsBox ol {
    margin: 0;
    padding: 0 0 20px 2em;
    font-size: 90%;
}

.contentsBox dd ol,.contentsBox ol ol,.contentsBox table ol,.contentsBox ul ol {
    font-size: 100%;
}

.contentsBox dd ol,.contentsBox ol ol,.contentsBox ol.marginSet,.contentsBox table ol,.contentsBox ul ol {
    padding-bottom: 0;
}

.contentsBox ol.marginSet>li {
    padding-bottom: 20px;
}

figure {
    padding: 0 0 20px;
    text-align: center;
}

figcaption {
    padding: 0 0 10px;
    font-size: 90%;
    font-weight: 700;
}

.contentsBox hr {
    position: relative;
    margin: 20px 0 40px;
    border: 0;
}

.contentsBox hr:after {
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0;
    left: 0;
    background-color: #eee;
}

.contentsBox dl dd.note,.contentsBox p.note,.contentsBox ul.note>li {
    position: relative;
    padding-left: 1.5em;
}

.contentsBox dl dd.note:before,.contentsBox p.note:before,.contentsBox ul.note>li:before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
}

p.btnLarge {
    display: table-cell;
    width: 980px;
    height: 150px;
    padding: 0 8%;
    text-align: center;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    background-color: #f1f5f8;
    vertical-align: middle;
}

p.btnLarge span {
    position: relative;
    display: block;
    max-width: 240px;
    margin: 0 auto;
    background-color: #dd3ca2;
    overflow: hidden;
    -moz-transition: box-shadow .3s linear;
    -webkit-transition: box-shadow .3s linear;
    -o-transition: box-shadow .3s linear;
    -ms-transition: box-shadow .3s linear;
    transition: box-shadow .3s linear;
}

.pc p.btnLarge span:hover {
    -moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
}

.pc p.btnLarge span:before {
    content: "";
    position: absolute;
    display: block;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #f95dc0;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc p.btnLarge span:hover:before {
    left: 140%;
}

p.btnLarge a {
    position: relative;
    display: block;
    padding: 15px 20px;
}

.pc .contentsBox .btnSubmit li:before,p.btnLarge a:after {
    content: "";
    position: absolute;
    display: block;
}

.sp p.btnLarge a:active,.sp p.btnLarge a:hover,p.btnLarge a:link,p.btnLarge a:visited {
    color: #fff;
}

.pc p.btnLarge a:active,.pc p.btnLarge a:hover {
    color: #fff;
    text-decoration: none;
}

p.btnLarge a:after {
    width: 8px;
    height: 8px;
    top: 50%;
    margin: -4px 0 0;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: right .2s linear;
    -webkit-transition: right .2s linear;
    -o-transition: right .2s linear;
    -ms-transition: right .2s linear;
    transition: right .2s linear;
}

.sp p.btnLarge a:active:after,.sp p.btnLarge a:hover:after,p.btnLarge a:link:after,p.btnLarge a:visited:after {
    right: 13px;
}

.pc p.btnLarge a:active:after,.pc p.btnLarge a:hover:after {
    right: 10px;
}

.contentsBox .btnSubmit {
    text-align: center;
}

.contentsBox .btnSubmit li {
    display: inline-block;
    min-width: 200px;
    margin: 0 0 20px;
    padding: 0;
    background-color: #dd3ca2;
    overflow: hidden;
    cursor: pointer;
    -moz-transition: box-shadow .3s linear;
    -webkit-transition: box-shadow .3s linear;
    -o-transition: box-shadow .3s linear;
    -ms-transition: box-shadow .3s linear;
    transition: box-shadow .3s linear;
}

.contentsBox .btnSubmit li+li {
    margin-left: 20px;
}

.contentsBox .btnSubmit li.nolink {
    background-color: #bfc3c6;
}

.pc .contentsBox .btnSubmit li:not(.nolink):hover {
    -moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
}

.pc .contentsBox .btnSubmit li:before {
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #f95dc0;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.contentsBox .btnSubmit .back:after,.contentsBox .btnSubmit .submit:after,.contentsBox .btnSubmit .top:after {
    position: absolute;
    width: 8px;
    height: 8px;
    top: 50%;
    content: "";
    display: block;
    z-index: 2;
    margin: -4px 0 0;
    border-bottom: solid 1px #fff;
}

.pc .contentsBox .btnSubmit li:not(.nolink):hover:before {
    left: 140%;
}

.contentsBox .btnSubmit .submit:after {
    left: auto;
    right: 13px;
    border-right: solid 1px #fff;
    background-color: transparent;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: right .2s linear;
    -webkit-transition: right .2s linear;
    -o-transition: right .2s linear;
    -ms-transition: right .2s linear;
    transition: right .2s linear;
}

.pc .contentsBox .btnSubmit .submit:not(.nolink):hover:after {
    right: 11px;
}

.contentsBox .btnSubmit .back:after,.contentsBox .btnSubmit .top:after {
    left: 13px;
    border-left: solid 1px #fff;
    background-color: transparent;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -moz-transition: left .2s linear;
    -webkit-transition: left .2s linear;
    -o-transition: left .2s linear;
    -ms-transition: left .2s linear;
    transition: left .2s linear;
}

.pc .contentsBox .btnSubmit .back:hover:after,.pc .contentsBox .btnSubmit .top:hover:after {
    left: 11px;
}

.contentsBox .btnSubmit a,.contentsBox .btnSubmit input {
    position: relative;
    display: block;
    min-width: 200px;
    padding: 15px;
    font-family: '游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 100%;
    color: #fff;
    text-align: center;
    line-height: 130%;
    border: 0;
    background-color: transparent;
}

.pc .contentsBox .btnSubmit li:not(.nolink) input {
    cursor: pointer;
}

.contentsBox #btnPrivacy {
    position: relative;
    padding: 0;
    max-width: none;
    background-color: #bfc3c6;
    overflow: hidden;
}

.pc .contentsBox #btnPrivacy:before {
    content: "";
    position: absolute;
    display: block;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #caced1;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc .contentsBox #btnPrivacy:hover:before {
    left: 140%;
}

.contentsBox #btnPrivacy a {
    position: relative;
    display: block;
    padding: 10px 15px;
    text-align: center;
}

.contentsBox #btnPrivacy a:after,.contentsBox #btnPrivacy a:before,.contentsBox #btnPrivacy:after {
    position: absolute;
    top: 50%;
    content: "";
}

.contentsBox #btnPrivacy a:active,.contentsBox #btnPrivacy a:hover,.contentsBox #btnPrivacy a:link,.contentsBox #btnPrivacy a:visited {
    color: #fff;
    text-decoration: none;
}

.contentsBox #btnPrivacy:after {
    width: 29px;
    height: 29px;
    right: 10px;
    margin: -15px 0 0;
    text-indent: -9999px;
    overflow: hidden;
    border: 1px solid #fff;
    cursor: pointer;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.contentsBox #btnPrivacy a:before {
    display: block;
    width: 15px;
    height: 1px;
    right: 17px;
    margin: -1px 0 0;
    background-color: #fff;
    -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out,right .3s ease-in-out;
    -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out,right .3s ease-in-out;
    -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out,right .3s ease-in-out;
    -ms-transition: -ms-transform .3s ease-in-out,width .3s ease-in-out,right .3s ease-in-out;
    transition: transform .3s ease-in-out,width .3s ease-in-out,right .3s ease-in-out;
}

.contentsBox #btnPrivacy a:after {
    display: block;
    width: 1px;
    height: 15px;
    right: 24px;
    margin: -8px 0 0;
    background-color: #fff;
    -moz-transition: -moz-transform .3s ease-in-out;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    -o-transition: -o-transform .3s ease-in-out;
    -ms-transition: -ms-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.pc .contentsBox #btnPrivacy:hover a:after,.pc .contentsBox #btnPrivacy:hover a:before {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.contentsBox #btnPrivacy.open a:before {
    width: 0;
    right: 24px;
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}

.contentsBox #btnPrivacy.open a:after {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.pc .contentsBox #btnPrivacy.open:hover a:after {
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}

.sectionBox1 {
    position: relative;
    min-height: 170px;
    padding: 25px 0 25px 75px;
    overflow: hidden;
}

.sectionBox1:first-of-type {
    margin-top: -20px;
}

.sectionBox1:after {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 100%;
    top: 150px;
    left: 75px;
    background-color: #fff;
    opacity: .3;
}

.sectionBox1:last-of-type:after {
    display: none;
}

.sectionBox1 .heading {
    position: absolute;
    z-index: 2;
    width: 150px;
    height: 150px;
    top: 0;
    left: 0;
    border: 10px solid rgba(255,255,255,.3);
    -moz-border-radius: 75px;
    -webkit-border-radius: 75px;
    -o-border-radius: 75px;
    -ms-border-radius: 75px;
    border-radius: 75px;
}

.sectionBox1 h3 {
    display: table-cell;
    width: 130px;
    height: 130px;
    padding: 5px 10px 0;
    font-size: 76%;
    line-height: 140%;
    text-align: center;
    color: #999;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    vertical-align: middle;
    background-color: #fff;
    -moz-border-radius: 65px;
    -webkit-border-radius: 65px;
    -o-border-radius: 65px;
    -ms-border-radius: 65px;
    border-radius: 65px;
}

.sectionBox1 h3 .sub {
    display: block;
    margin: 0 0 7px;
    font-family: Open Sans,Arial,Helvetica,sans-serif;
    font-size: 180%;
    line-height: 100%;
}

.contentsBox.blue .sectionBox1 h3 .sub {
    color: #588fe3;
}

.contentsBox.skyBlue .sectionBox1 h3 .sub {
    color: #3aaade;
}

.contentsBox.lightBlue .sectionBox1 h3 .sub {
    color: #27c0dc;
}

.contentsBox.blueGreen .sectionBox1 h3 .sub {
    color: #02aa9f;
}

.contentsBox.green .sectionBox1 h3 .sub {
    color: #219e62;
}

.sectionBox1 h3 .sub.jp {
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 140%;
    line-height: 140%;
}

.sectionBox1 h3 .sub.small {
    font-size: 150% !important;
}

.sectionBox1 h3 .sub.jp.small {
    font-size: 120% !important;
}

.sectionBox1 dl,.sectionBox1 p {
    position: relative;
    display: table-cell;
    padding: 0 0 0 95px;
    height: 100px;
    font-size: 90%;
    vertical-align: middle;
}

.sectionBox2 {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    padding: 0 0 10px 100px;
}

.sectionBox2:last-of-type {
    padding-bottom: 0;
}

.sectionBox2:before {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 30px;
    top: 0;
    left: 80px;
    background-color: #ddd;
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
}

.sectionBox2:after {
    position: absolute;
    display: block;
    width: 75px;
    top: 0;
    left: 0;
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 320%;
    line-height: 1em;
}

.contactList li,.imageList1 dl,.listBox1 section a h2,.listBox1 section a h3,.sectionBox2 h3 {
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
}

.sectionBox2:nth-of-type(1):after {
    content: "01";
    color: #588fe3;
}

.sectionBox2:nth-of-type(2):after {
    content: "02";
    color: #3aaade;
}

.sectionBox2:nth-of-type(3):after {
    content: "03";
    color: #27c0dc;
}

.sectionBox2:nth-of-type(4):after {
    content: "04";
    color: #02aa9f;
}

.sectionBox2:nth-of-type(5):after {
    content: "05";
    color: #219e62;
}

.sectionBox2:nth-of-type(6):after {
    content: "06";
    color: #629f44;
}

.sectionBox2:nth-of-type(7):after {
    content: "07";
    color: #899f44;
}

.contactList .btnLarge a:after,.contentsBox .imageList2 li:after,.imageList1 dl:after,.imageList1:after,.listBox1 .icon:before,.listBox1 .img,.listBox2 .img:after,.listBox2:after,.pc .contactList .btnLarge span:before,.pc .listBox1 section:before {
    content: "";
}

.sectionBox2 h3 {
    padding: 0 0 10px;
    font-size: 130%;
    line-height: 140%;
    color: #dd3ca2;
}

.sectionBox2:nth-of-type(1) h3 {
    color: #588fe3;
}

.sectionBox2:nth-of-type(2) h3 {
    color: #3aaade;
}

.sectionBox2:nth-of-type(3) h3 {
    color: #27c0dc;
}

.sectionBox2:nth-of-type(4) h3 {
    color: #02aa9f;
}

.sectionBox2:nth-of-type(5) h3 {
    color: #219e62;
}

.sectionBox2:nth-of-type(6) h3 {
    color: #629f44;
}

.sectionBox2:nth-of-type(7) h3 {
    color: #899f44;
}

.sectionBox2 h3:only-child {
    min-height: 4em;
    font-size: 110%;
}

.contactList {
    width: 100%;
    display: table;
}

.contactList li {
    display: table-cell;
    width: 50%;
    height: 150px;
    text-align: center;
    background-color: #f1f5f8;
    vertical-align: middle;
}

.contactList address {
    font-size: 90%;
    letter-spacing: .03em;
}

.contactList address a,.contactList address span {
    margin: 0 0 3px;
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 220%;
    letter-spacing: 0;
    color: #d7277a;
}

.contactList address span {
    display: block;
}

.contactList address a,.phone .contactList address span {
    display: none;
}

.phone .contactList address a {
    display: block;
}

.contactList address a:active,.contactList address a:hover,.contactList address a:link,.contactList address a:visited {
    color: #d7277a;
    text-decoration: none;
}

.contactList .btnLarge {
    padding: 0 15px;
    border-left: solid 1px #fff;
}

.contactList .btnLarge span {
    position: relative;
    display: block;
    max-width: 240px;
    margin: 0 auto;
    background-color: #dd3ca2;
    overflow: hidden;
    -moz-transition: box-shadow .3s linear;
    -webkit-transition: box-shadow .3s linear;
    -o-transition: box-shadow .3s linear;
    -ms-transition: box-shadow .3s linear;
    transition: box-shadow .3s linear;
}

.pc .contactList .btnLarge span:hover {
    -moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
    box-shadow: 0 0 20px 0 rgba(0,0,0,.3);
}

.pc .contactList .btnLarge span:before {
    position: absolute;
    display: block;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #f95dc0;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc .contactList .btnLarge span:hover:before {
    left: 140%;
}

.contactList .btnLarge a {
    position: relative;
    display: block;
    padding: 15px 20px;
}

.contactList .btnLarge a:link,.contactList .btnLarge a:visited,.sp .contactList .btnLarge a:active,.sp .contactList .btnLarge a:hover {
    color: #fff;
}

.pc .contactList .btnLarge a:active,.pc .contactList .btnLarge a:hover {
    color: #fff;
    text-decoration: none;
}

.contactList .btnLarge a:after {
    position: absolute;
    display: block;
    width: 8px;
    height: 8px;
    top: 50%;
    margin: -4px 0 0;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: right .2s linear;
    -webkit-transition: right .2s linear;
    -o-transition: right .2s linear;
    -ms-transition: right .2s linear;
    transition: right .2s linear;
}

.contactList .btnLarge a:link:after,.contactList .btnLarge a:visited:after,.sp .contactList .btnLarge a:active:after,.sp .contactList .btnLarge a:hover:after {
    right: 13px;
}

.pc .contactList .btnLarge a:active:after,.pc .contactList .btnLarge a:hover:after {
    right: 10px;
}

.imageList1 {
    max-width: 720px;
    margin: 0 auto;
}

.imageList1:after {
    display: block;
    clear: both;
}

.imageList1 dl {
    position: relative;
    float: left;
    width: 33.33333333%;
    padding: 60px 0 30px;
    text-align: center;
}

.imageList1 dl:after {
    position: absolute;
    display: block;
    width: 120px;
    height: 60px;
    top: 10px;
    left: 50%;
    margin: 0 0 0 -60px;
    background-image: url(../images/icon.png);
    background-repeat: no-repeat;
    -moz-background-size: 420px 940px;
    -webkit-background-size: 420px 940px;
    -o-background-size: 420px 940px;
    -ms-background-size: 420px 940px;
    background-size: 420px 940px;
}

.listBox2 .img,.topMainvisualArea .imgArea .img {
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
}

.imageList1 .web:after {
    background-position: -10px -860px;
}

.imageList1 .graphic:after {
    background-position: -150px -860px;
}

.imageList1 .movie:after {
    background-position: -290px -860px;
}

.listBox2 .img,.listBox5 .img,.topMainvisualArea .imgArea .img {
    background-position: center center;
}

.imageList1 dl:nth-of-type(1):after {
    background-color: #588fe3;
}

.imageList1 dl:nth-of-type(2):after {
    background-color: #3aaade;
}

.imageList1 dl:nth-of-type(3):after {
    background-color: #27c0dc;
}

.imageList1 dl:nth-of-type(4):after {
    background-color: #02aa9f;
}

.imageList1 dl:nth-of-type(5):after {
    background-color: #219e62;
}

.imageList1 dl:nth-of-type(6):after {
    background-color: #629f44;
}

.imageList1 dl:nth-of-type(7):after {
    background-color: #899f44;
}

.imageList1 dt {
    display: table-cell;
    width: 300px;
    height: 5.5em;
    color: #000;
    line-height: 130%;
    font-weight: 400;
    vertical-align: middle;
}

.imageList1 dd {
    font-size: 90%;
    padding: 0;
}

.imageList1 em {
    display: inline-block;
    width: 1.7em;
    margin: 0 5px 0 0;
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 400%;
    font-weight: 400;
    text-align: right;
}

.imageList1 dl:nth-of-type(1) em {
    color: #588fe3;
}

.imageList1 dl:nth-of-type(2) em {
    color: #3aaade;
}

.imageList1 dl:nth-of-type(3) em {
    color: #27c0dc;
}

.imageList1 dl:nth-of-type(4) em {
    color: #02aa9f;
}

.imageList1 dl:nth-of-type(5) em {
    color: #219e62;
}

.imageList1 dl:nth-of-type(6) em {
    color: #629f44;
}

.imageList1 dl:nth-of-type(7) em {
    color: #899f44;
}

.contentsBox .imageList2 {
    padding: 0 0 5px;
}

.contentsBox .imageList2 li {
    position: relative;
    margin: 0 0 15px;
    padding: 12px 15px;
    line-height: 140%;
    background-color: #f1f5f8;
    border-left: solid 42px #bfc9d0;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    -o-border-radius: 30px;
    -ms-border-radius: 30px;
    border-radius: 30px;
}

.contentsBox.blue .imageList2 li,.contentsBox.gray .imageList2 li {
    background-color: #fff;
}

.contentsBox .imageList2 li:after {
    position: absolute;
    display: block;
    width: 6px;
    height: 12px;
    top: 50%;
    left: -20px;
    margin: -8px 0 0;
    border-right: solid 2px #fff;
    border-bottom: solid 2px #fff;
    background-color: transparent;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.listBox1 section {
    position: relative;
    z-index: 1;
    overflow: hidden;
    -moz-transition: box-shadow .3s linear,z-index .3s linear;
    -webkit-transition: box-shadow .3s linear,z-index .3s linear;
    -ms-transition: box-shadow .3s linear,z-index .3s linear;
    -o-transition: box-shadow .3s linear,z-index .3s linear;
    transition: box-shadow .3s linear,z-index .3s linear;
}

.pc .listBox1 section:hover {
    z-index: 100;
    -moz-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.pc .listBox2 a:active,.pc .listBox2 a:hover,.pc .listBox3 a:active,.pc .listBox3 a:hover {
    -moz-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    text-decoration: none;
}

.listBox1 section:nth-of-type(1) {
    background-color: #588fe3;
}

.listBox1 section:nth-of-type(2) {
    background-color: #3aaade;
}

.listBox1 section:nth-of-type(3) {
    background-color: #27c0dc;
}

.listBox1 section:nth-of-type(4) {
    background-color: #02aa9f;
}

.listBox1 section:nth-of-type(5) {
    background-color: #219e62;
}

.listBox1 section:nth-of-type(6) {
    background-color: #629f44;
}

.listBox1 section:nth-of-type(7) {
    background-color: #899f44;
}

.listBox1 section:nth-of-type(8) {
    background-color: #b1aa33;
}

.listBox1 section:nth-of-type(9) {
    background-color: #c9ad3a;
}

.listBox1 section:nth-of-type(10) {
    background-color: #cb952d;
}

.pc .listBox1 section:before {
    position: absolute;
    display: block;
    width: 140%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #fff;
    opacity: .1;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .3s ease-in-out;
    -webkit-transition: left .3s ease-in-out;
    -o-transition: left .3s ease-in-out;
    -ms-transition: left .3s ease-in-out;
    transition: left .3s ease-in-out;
}

.pc .listBox1 section:hover:before {
    left: 150%;
}

.listBox1 section a {
    position: relative;
    display: table;
    width: 100%;
    height: 200px;
}

.listBox1 section a:active,.listBox1 section a:hover,.listBox1 section a:link,.listBox1 section a:visited {
    color: #fff;
    text-decoration: none;
}

.listBox1 .icon:before,.listBox1 .img {
    position: relative;
    display: table-cell;
    width: 33.33333333%;
}

.listBox1 .img span,.listBox1 img {
    position: absolute;
    display: block;
    height: 120px;
    top: 0;
}

.listBox1 .icon:after {
    top: 0;
    bottom: 0;
    left: 16.66666666%;
    margin: auto -70px;
    -moz-transition: opacity .3s linear;
    -webkit-transition: opacity .3s linear;
    -o-transition: opacity .3s linear;
    -ms-transition: opacity .3s linear;
    transition: opacity .3s linear;
}

.listBox1 section .icon:link:after,.listBox1 section .icon:visited:after,.sp .listBox1 section .icon:active:after,.sp .listBox1 section .icon:hover:after {
    opacity: .8;
}

.pc .listBox1 section .icon:active:after,.pc .listBox1 section .icon:hover:after {
    opacity: 1;
}

.listBox1 .img span {
    width: 120px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    overflow: hidden;
    -moz-border-radius: 60px;
    -webkit-border-radius: 60px;
    -o-border-radius: 60px;
    -ms-border-radius: 60px;
    border-radius: 60px;
}

.listBox1 img {
    width: 194px;
    max-width: none;
    left: 50%;
    margin: 0 0 0 -97px;
}

.listBox1 .textArea {
    display: table-cell;
    width: 66.66666666%;
    padding: 30px 5% 30px 0;
    vertical-align: middle;
}

.listBox1 section a h2,.listBox1 section a h3 {
    padding: 0 0 10px;
}

.listBox2 .icon:before,.pager .pagination .page-numbers,.topMainvisualArea .icon:before {
    font-family: Open Sans,Arial,Helvetica,sans-serif;
}

.listBox1 section a:active h2,.listBox1 section a:active h3,.listBox1 section a:hover h2,.listBox1 section a:hover h3,.listBox1 section a:link h2,.listBox1 section a:link h3,.listBox1 section a:visited h2,.listBox1 section a:visited h3 {
    text-decoration: none;
}

.listBox1 .text {
    font-size: 83%;
}

.listBox1 section a+p {
    display: none;
}

.listBox2 {
    width: 100.01%;
    background-color: #fff;
}

.listBox2:after {
    display: block;
    clear: both;
}

.listBox3+.listBox2 {
    background-color: transparent;
}

.listBox2>h2 {
    padding: 40px 8%;
}

.listBox2 section {
    float: left;
    width: 33.33333333%;
}

.listBox2 a {
    position: relative;
    display: block;
    height: 18.5em;
    overflow: hidden;
    -moz-transition: box-shadow .3s linear,z-index .3s linear;
    -webkit-transition: box-shadow .3s linear,z-index .3s linear;
    -ms-transition: box-shadow .3s linear,z-index .3s linear;
    -o-transition: box-shadow .3s linear,z-index .3s linear;
    transition: box-shadow .3s linear,z-index .3s linear;
}

.listBox2 .img,.listBox2 .img:after {
    position: absolute;
    width: 100%;
    height: 100%;
}

.listBox2 a:link,.listBox2 a:visited,.sp .listBox2 a:active,.sp .listBox2 a:hover {
    z-index: 1;
    color: #707070;
    background-color: #000;
}

.pc .listBox2 a:active,.pc .listBox2 a:hover {
    z-index: 100;
    color: #707070;
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.listBox2 .img {
    background-repeat: no-repeat;
    background-size: cover;
    -moz-transition: -moz-transform .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out;
    transition: transform .3s ease-out;
}

.pc .listBox2 a:hover .img {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.listBox2 .img:after {
    display: block;
    background-color: #000;
    opacity: .7;
}

.listBox2 .textArea {
    position: relative;
    padding: 60px 0 0;
    text-align: center;
}

.listBox2 .time {
    padding: 0 10%;
    color: #3aaade;
    font-size: 76%;
}

.listBox2 .icon {
    position: relative;
    width: 70px;
    height: 70px;
    margin: 0 auto 30px;
    text-indent: -9999px;
    overflow: hidden;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.listBox2 .icon:before {
    position: absolute;
    display: block;
    width: 70px;
    top: 37px;
    left: 0;
    font-size: 10px;
    color: #fff;
    text-align: center;
    text-indent: 0;
}

.contentsBox table.price td,.contentsBox table.price th,.listBox3 section h2,.listBox4 section>a h2,.listBox4 section>a h3,.listBox5 section h2,.listBox5 section h3 {
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
}

.listBox2 .icon:after {
    width: 40px;
    height: 40px;
    top: 5px;
    left: 15px;
}

.listBox2 .iconColumn {
    background-color: #27c0dc;
}

.listBox2 .iconNews {
    background-color: #e2962a;
}

.listBox2 .iconColumn:before {
    content: "COLUMN";
}

.listBox2 .iconNews:before {
    content: "NEWS";
    letter-spacing: .1em;
}

.listBox3:after,.listBox4:after,.pc .listBox3 a:before,.pc .listBox4 .img:before {
    content: "";
}

.listBox2 .iconColumn:after {
    background-position: -200px 0;
}

.listBox2 .iconNews:after {
    background-position: -280px 0;
}

.listBox2 section h2,.listBox2 section h3 {
    padding: 0 10% 10px;
    color: #fff;
    font-size: 90%;
}

.listBox2 .text {
    padding: 0 10%;
    color: #fff;
    font-size: 76%;
}

.listBox3 {
    width: 100.01%;
}

.listBox3:after {
    display: block;
    clear: both;
}

.listBox3 section {
    float: left;
    width: 33.33333333%;
}

.listBox3 a {
    position: relative;
    display: block;
    height: 18.5em;
    padding: 140px 10% 0;
    text-align: center;
    overflow: hidden;
    -moz-transition: box-shadow .3s linear,z-index .3s linear;
    -webkit-transition: box-shadow .3s linear,z-index .3s linear;
    -o-transition: box-shadow .3s linear,z-index .3s linear;
    -ms-transition: box-shadow .3s linear,z-index .3s linear;
    transition: box-shadow .3s linear,z-index .3s linear;
}

.listBox3 a:link,.listBox3 a:visited,.sp .listBox3 a:active,.sp .listBox3 a:hover {
    z-index: 1;
    color: #fff;
}

.pc .listBox3 a:active,.pc .listBox3 a:hover {
    z-index: 200;
    color: #fff;
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.pc .listBox4 section:hover,.pc .listBox5 a:active,.pc .listBox5 a:hover {
    -moz-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -o-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
    -ms-box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.pc .listBox3 a:before {
    position: absolute;
    display: block;
    width: 140%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #fff;
    opacity: .1;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out;
    -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc .listBox3 a:hover:before {
    left: 150%;
}

.listBox3 section:nth-of-type(1) a {
    background-color: #588fe3;
}

.listBox3 section:nth-of-type(2) a,.listBox3 section:nth-of-type(4) a {
    background-color: #3aaade;
}

.listBox3 section:nth-of-type(3) a,.listBox3 section:nth-of-type(5) a,.listBox3 section:nth-of-type(7) a {
    background-color: #27c0dc;
}

.listBox3 section:nth-of-type(10) a,.listBox3 section:nth-of-type(6) a,.listBox3 section:nth-of-type(8) a {
    background-color: #02aa9f;
}

.listBox3 section:nth-of-type(11) a,.listBox3 section:nth-of-type(13) a,.listBox3 section:nth-of-type(9) a {
    background-color: #219e62;
}

.listBox3 section:nth-of-type(12) a,.listBox3 section:nth-of-type(14) a,.listBox3 section:nth-of-type(16) a {
    background-color: #629f44;
}

.listBox3 section:nth-of-type(15) a,.listBox3 section:nth-of-type(17) a,.listBox3 section:nth-of-type(19) a {
    background-color: #899f44;
}

.listBox3 section:nth-of-type(18) a,.listBox3 section:nth-of-type(20) a,.listBox3 section:nth-of-type(22) a {
    background-color: #b1aa33;
}

.listBox3 a:after {
    top: 30px;
    left: 50%;
    margin: 0 0 0 -70px;
    -moz-transition: opacity .3s linear;
    -webkit-transition: opacity .3s linear;
    -o-transition: opacity .3s linear;
    -ms-transition: opacity .3s linear;
    transition: opacity .3s linear;
}

.listBox3 a:link:after,.listBox3 a:visited:after,.sp .listBox3 a:active:after,.sp .listBox3 a:hover:after {
    opacity: .8;
}

.pc .listBox3 a:active:after,.pc .listBox3 a:hover:after {
    opacity: 1;
}

.listBox3 section h2 {
    position: relative;
    display: table-cell;
    width: 500px;
    height: 45px;
    font-size: 90%;
    line-height: 130%;
    vertical-align: middle;
}

.listBox3 section h2:after,.listBox3 section h2:before {
    content: "";
    position: absolute;
    display: block;
    width: 100px;
    height: 1px;
    left: 50%;
    margin: 0 0 0 -50px;
    background-color: #fff;
    opacity: .5;
}

.listBox3 section h2:before {
    top: 0;
}

.listBox3 section h2:after {
    bottom: 0;
}

.listBox3 .text {
    position: relative;
    padding: 15px 0 0;
    color: #fff;
    font-size: 76%;
}

.listBox4 {
    width: 100.01%;
    background-color: #fff;
}

.tag+.listBox4 {
    background-color: transparent;
}

.listBox4:after {
    display: block;
    clear: both;
}

.listBox4>h2 {
    padding: 40px 8%;
}

.listBox4 section {
    position: relative;
    z-index: 1;
    float: left;
    width: 33.33333333%;
    background-color: #fff;
    opacity: 1;
    -moz-transition: -moz-transform .2s ease-out,opacity .2s linear,box-shadow .3s linear,z-index .3s linear;
    -webkit-transition: -webkit-transform .2s ease-out,opacity .2s linear,box-shadow .3s linear,z-index .3s linear;
    -o-transition: -o-transform .2s ease-out,opacity .2s linear,box-shadow .3s linear,z-index .3s linear;
    -ms-transition: -ms-transform .2s ease-out,opacity .2s linear,box-shadow .3s linear,z-index .3s linear;
    transition: transform .2s ease-out,opacity .2s linear,box-shadow .3s linear,z-index .3s linear;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 section:hover {
    z-index: 100;
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.listBox4 section>a {
    position: relative;
    display: block;
    height: 25em;
}

.listBox4 section>a:active,.listBox4 section>a:hover {
    text-decoration: none;
}

.listBox4 .img {
    position: relative;
    overflow: hidden;
}

.pc .listBox4 section>a:hover .img {
    background-color: #000;
}

.pc .listBox4 .img:before {
    position: absolute;
    z-index: 1;
    display: block;
    width: 101%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #000;
    opacity: 0;
    -moz-transition: opacity .3s ease-out;
    -webkit-transition: opacity .3s ease-out;
    -o-transition: opacity .3s ease-out;
    -ms-transition: opacity .3s ease-out;
    transition: opacity .3s ease-out;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 .img:after,.pc .topMainvisualArea .imgArea:after {
    width: 150px;
    height: 40px;
    -o-transition: -o-transform .3s ease-out,opacity .3s ease-out;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 section>a:hover .img:before {
    opacity: .6;
}

.pc .listBox4 .img:after {
    content: "詳細を見る";
    position: absolute;
    z-index: 2;
    display: block;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 83%;
    line-height: 40px;
    color: #fff;
    text-align: center;
    border: 1px solid #fff;
    opacity: 0;
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    -moz-transition: -moz-transform .3s ease-out,opacity .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out,opacity .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out,opacity .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 section>a[target] .img:after {
    content: "サイトを見る";
}

.pc .listBox4 .enlarge .img:after {
    content: "画像を拡大";
}

.pc .listBox4 .play .img:after,.pc .listBox4 .playYouTube .img:after {
    content: "映像を再生";
}

.listBox5 .imgArea:before,.listBox5 section:before,.pc .listBox4 .btn a:after,.pc .listBox4 .btn:before {
    content: "";
}

.pc .listBox4 section>a:hover .img:after {
    opacity: 1;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.listBox4 img {
    display: block;
    width: 100%;
    -moz-transition: -moz-transform .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out;
    transition: transform .3s ease-out;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 section>a:hover img {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.listBox4 section>a h2,.listBox4 section>a h3 {
    display: table-cell;
    width: 500px;
    height: 70px;
    padding: 10px 10% 5px;
    line-height: 140%;
    text-align: center;
    vertical-align: middle;
}

.listBox4 section>a:active h2,.listBox4 section>a:active h3,.listBox4 section>a:hover h2,.listBox4 section>a:hover h3,.listBox4 section>a:link h2,.listBox4 section>a:link h3,.listBox4 section>a:visited h2,.listBox4 section>a:visited h3 {
    color: #000;
}

.listBox4 section>a h2 span,.listBox4 section>a h3 span {
    display: block;
    font-size: 76%;
    line-height: 140%;
}

.listBox4 section>a:active h2 span,.listBox4 section>a:active h3 span,.listBox4 section>a:hover h2 span,.listBox4 section>a:hover h3 span,.listBox4 section>a:link h2 span,.listBox4 section>a:link h3 span,.listBox4 section>a:visited h2 span,.listBox4 section>a:visited h3 span {
    color: #999;
}

.listBox4 .btn a:link,.listBox4 .btn a:visited,.listBox4 section a:active .text,.listBox4 section a:hover .text,.listBox4 section a:link .text,.listBox4 section a:visited .text,.sp .listBox4 .btn a:active,.sp .listBox4 .btn a:hover {
    color: #707070;
}

.listBox4 .text {
    padding: 0 10% 15px;
    font-size: 83%;
    line-height: 160%;
}

#footerMenu li,.tabNav li {
    line-height: 140%;
}

.listBox4 .btn {
    position: relative;
    clear: both;
    max-width: 240px;
    margin: 15px auto 30px;
    overflow: hidden;
}

.pc .listBox4 .btn:before {
    position: absolute;
    display: block;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    background-color: #0090d4;
    opacity: 0;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out,opacity .2s linear;
    -webkit-transition: left .2s ease-in-out,opacity .2s linear;
    -o-transition: left .2s ease-in-out,opacity .2s linear;
    -ms-transition: left .2s ease-in-out,opacity .2s linear;
    transition: left .2s ease-in-out,opacity .2s linear;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 .btn:hover:before {
    left: 140%;
    opacity: 1;
}

.listBox4 .btn a {
    position: relative;
    display: block;
    padding: 10px 15px;
    font-size: 90%;
    text-align: center;
    border: 2px solid #707070;
    -moz-transition: color .2s linear;
    -webkit-transition: color .2s linear;
    -o-transition: color .2s linear;
    -ms-transition: color .2s linear;
    transition: color .2s linear;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.pc .listBox4 .btn a:active,.pc .listBox4 .btn a:hover {
    color: #fff;
    text-decoration: none;
}

.pc .listBox4 .btn a:after {
    position: absolute;
    display: block;
    width: 8px;
    height: 8px;
    top: 50%;
    margin: -4px 0 0;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: right .2s linear,border .2s linear;
    -webkit-transition: right .2s linear,border .2s linear;
    -o-transition: right .2s linear,border .2s linear;
    -ms-transition: right .2s linear,border .2s linear;
    transition: right .2s linear,border .2s linear;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}

.listBox4 .btn a:link:after,.listBox4 .btn a:visited:after,.sp .listBox4 .btn a:active:after,.sp .listBox4 .btn a:hover:after {
    right: 13px;
    border-right: solid 1px #b8bec1;
    border-bottom: solid 1px #b8bec1;
}

.pc .listBox4 .btn a:active:after,.pc .listBox4 .btn a:hover:after {
    right: 10px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
}

.listBox4 .hide {
    opacity: 0;
    -moz-transform: translate3d(0,30px,0);
    -webkit-transform: translate3d(0,30px,0);
    -o-transform: translate3d(0,30px,0);
    -ms-transform: translate3d(0,30px,0);
    transform: translate3d(0,30px,0);
    backface-visibility: hidden;
}

.listBox5 {
    background-color: #fff;
}

.listBox5+.listBox5 {
    border-top: solid 1px #eee;
}

.listBox5>h2 {
    padding: 40px 8%;
}

.listBox5 section {
    position: relative;
}

.listBox5 section:before {
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    top: 0;
    left: 0;
    background-color: #eee;
}

.listBox5 section:first-of-type:before {
    display: none;
}

.listBox5 h2+section:first-of-type:before {
    display: block;
}

.pc .listBox5 section:hover+section:before,.pc .listBox5 section:hover:before {
    display: none !important;
}

.listBox5 a {
    position: relative;
    display: block;
    -moz-transition: box-shadow .3s linear,z-index .3s linear;
    -webkit-transition: box-shadow .3s linear,z-index .3s linear;
    -o-transition: box-shadow .3s linear,z-index .3s linear;
    -ms-transition: box-shadow .3s linear,z-index .3s linear;
    transition: box-shadow .3s linear,z-index .3s linear;
}

.listBox5 a:link,.listBox5 a:visited,.sp .listBox5 a:active,.sp .listBox5 a:hover {
    z-index: 1;
}

.pc .listBox5 a:active,.pc .listBox5 a:hover {
    z-index: 100;
    text-decoration: none;
    box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}

.listBox5 .imgArea {
    position: absolute;
    width: 50%;
    height: 100%;
    min-height: 240px;
    top: 0;
    left: 0;
    overflow: hidden;
}

.listBox5 .img,.listBox5 .imgArea:before {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.listBox5 .imgArea:before {
    z-index: 1;
    min-height: 240px;
    background-color: #000;
    opacity: .7;
}

.listBox5 .img {
    -moz-transition: -moz-transform .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out;
    transition: transform .3s ease-out;
}

.listBox5 .text,.listBox5 .title {
    display: table-cell;
    padding: 30px 10%;
    height: 240px;
    vertical-align: middle;
}

.pc .listBox5 a:hover .img {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.listBox5 .title {
    position: relative;
    z-index: 2;
    width: 500px;
    top: 0;
    left: 0;
    text-align: center;
}

.listBox5 section a:active h2,.listBox5 section a:active h3,.listBox5 section a:hover h2,.listBox5 section a:hover h3,.listBox5 section a:link h2,.listBox5 section a:link h3,.listBox5 section a:visited h2,.listBox5 section a:visited h3 {
    color: #fff;
}

.listBox5 .time {
    font-size: 76%;
}

.listBox5 a:active .time,.listBox5 a:hover .time,.listBox5 a:link .time,.listBox5 a:visited .time {
    color: #3aaade;
}

.listBox5 .textArea {
    position: relative;
    width: 50%;
    margin: 0 0 0 auto;
}

.listBox5 .text {
    width: 100%;
    font-size: 83%;
}

.icon:after,.tabNav li:before {
    content: "";
    display: block;
}

.listBox5 a:active .text,.listBox5 a:hover .text,.listBox5 a:link .text,.listBox5 a:visited .text {
    color: #707070;
}

.icon:after {
    position: absolute;
    width: 140px;
    height: 100px;
    background-image: url(../../common/images/icon.png);
    background-repeat: no-repeat;
    background-size: 420px 940px;
}

.iconSmart4meBiz:after {
    background-position: 0 -40px;
}

.iconSmart4me:after {
    background-position: -140px -40px;
}

.iconCrossMedia:after {
    background-position: -280px -40px;
}

.iconRWD:after {
    background-position: 0 -140px;
}

.iconSP:after {
    background-position: -140px -140px;
}

.iconLarge:after {
    background-position: -280px -140px;
}

.iconSystem:after {
    background-position: 0 -240px;
}

.iconInternational:after {
    background-position: -140px -240px;
}

.iconRecruitTool:after {
    background-position: -280px -240px;
}

.iconResearch:after {
    background-position: 0 -340px;
}

.iconSEO:after {
    background-position: -140px -340px;
}

.iconTranslation:after {
    background-position: -280px -340px;
}

.iconWeb:after {
    background-position: 0 -440px;
}

.iconGraphic:after {
    background-position: -140px -440px;
}

.iconMovie:after {
    background-position: -280px -440px;
}

.iconCorporate:after {
    background-position: 0 -540px;
}

.iconCompany:after {
    background-position: -140px -540px;
}

.iconPhilosophy:after {
    background-position: -280px -540px;
}

.iconAccess:after {
    background-position: 0 -640px;
}

.iconNews:after {
    background-position: -140px -640px;
}

.iconRecruitInfo:after {
    background-position: -280px -640px;
}

.iconMessage:after {
    background-position: 0 -740px;
}

.iconStaff:after {
    background-position: -140px -740px;
}

.iconRecruit:after {
    background-position: -280px -740px;
}

.contentsBox table {
    width: 100%;
    margin: 0 0 20px;
}

.contentsBox table th {
    width: 25%;
    padding: 15px 5% 15px 0;
    color: #000;
    font-size: 90%;
    vertical-align: top;
}

.blue table th,.lightBlue table th,.skyBlue table th {
    color: #fff;
}

.contentsBox table td {
    padding: 15px 0;
    font-size: 90%;
    vertical-align: top;
}

.tabNav li a,.topMainvisualArea h2,input,label {
    vertical-align: middle;
}

.contentsBox table.price td,.contentsBox table.price th {
    width: 33.33333333%;
    line-height: 140%;
    text-align: center;
    vertical-align: middle;
    background-color: #fff;
    border-left: solid 1px #e4e8ec;
    border-bottom: solid 1px #e4e8ec;
}

.contentsBox table.price th {
    padding: 30px 15px;
}

.contentsBox table.price td {
    padding: 12px 15px;
    font-size: 83%;
}

.contentsBox table.price tbody tr:last-of-type td {
    border-bottom: 0 none;
}

.contentsBox table.price tbody tr:first-of-type td {
    padding: 30px 15px;
}

.contentsBox table.price tbody td:first-of-type {
    border-left: 0 none;
}

.contentsBox table.price em {
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 240% !important;
}

.contentsBox table.price .blue {
    background-color: #588fe3;
    border: 0;
    color: #fff;
}

.contentsBox table.price .skyBlue {
    background-color: #3aaade;
    border: 0;
    color: #fff;
}

.contentsBox table.price .lightBlue {
    background-color: #27c0dc;
    border: 0;
    color: #fff;
}

.tabNav ul {
    background-color: #252829;
    overflow: hidden;
}

.tabNav li:before,.tag {
    background-color: #333739;
}

.tabNav li {
    position: relative;
    float: left;
    width: 25%;
    font-size: 83%;
    overflow: hidden;
}

.tabNav li:before {
    position: absolute;
    width: 130%;
    height: 100%;
    top: 0;
    left: 10%;
    -moz-transform: translateX(-120%) skewX(15deg);
    -webkit-transform: translateX(-120%) skewX(15deg);
    -o-transform: translateX(-120%) skewX(15deg);
    -ms-transform: translateX(-120%) skewX(15deg);
    transform: translateX(-120%) skewX(15deg);
    -moz-transition: left .2s ease-in-out;
    -webkit-transition: left .2s ease-in-out;
    -o-transition: left .2s ease-in-out -ms-transition: left .2s ease-in-out;
    transition: left .2s ease-in-out;
}

.pc .tabNav li:hover:before,.tabNav .current:before,.tabNav .parent:before {
    left: 140%;
}

.tabNav li a {
    position: relative;
    display: table-cell;
    width: 300px;
    height: 55px;
    padding: 0 15px;
    border-left: solid 1px #333739;
    text-align: center;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    -moz-transition: color .2s linear;
    -webkit-transition: color .2s linear;
    -o-transition: color .2s linear;
    -ms-transition: color .2s linear;
    transition: color .2s linear;
}

.tabNav li:first-of-type a {
    border-left: 0 none;
}

.sp .tabNav li a:active,.sp .tabNav li a:hover,.tabNav li a:link,.tabNav li a:visited {
    color: #bbb;
}

.pc .tabNav li a:active,.pc .tabNav li a:hover,.tabNav .current a,.tabNav .parent a {
    color: #fff !important;
    text-decoration: none;
}

.tag {
    /*padding: 30px 8% 15px;*/
    overflow: hidden;
}

.tag li {
    float: left;
    width: 33.33333333%;
    padding: 0 10px 15px;
    font-size: 67%;
}

.tag li:first-of-type,.tag li:nth-of-type(3n+1) {
    clear: both;
    padding-left: 0;
}

.tag li:nth-of-type(3n) {
    padding-right: 0;
}

.tag li a {
    position: relative;
    display: block;
    padding: 0 0 0 25px;
}

.tag li a:before,.tag li.current a:after {
    position: absolute;
    content: "";
}

.sp .tag li a:active,.sp .tag li a:hover,.tag li a:link,.tag li a:visited {
    color: #bbb;
}

.pc .tag li a:active,.pc .tag li a:hover,.tag li.current a {
    color: #fff;
    text-decoration: none;
}

.tag li a:before {
    width: 16px;
    height: 16px;
    top: 0;
    left: 0;
    border: 1px solid #999;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
}

.nextBtn li a,.tag li.current a:before {
    border: 1px solid #fff;
}

.tag li.current a:after {
    display: block;
    width: 8px;
    height: 8px;
    top: 4px;
    left: 4px;
    background-color: #fff;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
}

.nextBtn {
    position: relative;
    background-color: #333739;
    height: 75px;
}

.nextBtn li {
    position: absolute;
    width: 35px;
}

.nextBtn .prev {
    top: 20px;
    left: 50%;
    margin: 0 0 0 -80px;
}

.nextBtn .index {
    top: 20px;
    left: 50%;
    margin: 0 0 0 -17px;
}

.nextBtn .next {
    top: 20px;
    left: 50%;
    margin: 0 0 0 45px;
}

.nextBtn li a {
    display: block;
    height: 35px;
    overflow: hidden;
    text-indent: -9999px;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -o-border-radius: 18px;
    -ms-border-radius: 18px;
    border-radius: 18px;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    transition: background-color .2s linear;
}

.pc .nextBtn li a:hover {
    background-color: #fff;
}

.nextBtn .next a:before,.nextBtn .prev a:before {
    content: "";
    position: absolute;
    display: block;
    width: 15px;
    height: 1px;
    top: 17px;
    left: 10px;
    background-color: #fff;
    -moz-transition: left .2s linear,background-color .2s linear;
    -webkit-transition: left .2s linear,background-color .2s linear;
    -o-transition: left .2s linear,background-color .2s linear;
    -ms-transition: left .2s linear,background-color .2s linear;
    transition: left .2s linear,background-color .2s linear;
}

.pc .nextBtn .prev a:hover:before {
    left: 8px;
    background-color: #333739;
}

.pc .nextBtn .next a:hover:before {
    left: 12px;
    background-color: #333739;
}

.nextBtn .next a:after,.nextBtn .prev a:after {
    content: "";
    position: absolute;
    display: block;
    width: 11px;
    height: 11px;
    top: 12px;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -moz-transition: border .2s linear,left .2s linear,right .2s linear;
    -webkit-transition: border .2s linear,left .2s linear,right .2s linear;
    -o-transition: border .2s linear,left .2s linear,right .2s linear;
    -ms-transition: border .2s linear,left .2s linear,right .2s linear;
    transition: border .2s linear,left .2s linear,right .2s linear;
}

.nextBtn .prev a:after {
    left: 10px;
    border-left: solid 1px #fff;
    border-bottom: solid 1px #fff;
}

.nextBtn .next a:after {
    right: 10px;
    border-right: solid 1px #fff;
    border-top: solid 1px #fff;
}

.pc .nextBtn .prev a:hover:after {
    left: 8px;
    border-left: solid 1px #333739;
    border-bottom: solid 1px #333739;
}

.pc .nextBtn .next a:hover:after {
    right: 8px;
    border-right: solid 1px #333739;
    border-top: solid 1px #333739;
}

.nextBtn .index a:after,.nextBtn .index a:before {
    position: absolute;
    top: 0;
    right: 0;
    margin: auto;
    bottom: 0;
}

.nextBtn .index a:before {
    content: "";
    display: block;
    width: 13px;
    height: 13px;
    left: 0;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    -moz-transition: border .2s linear;
    -webkit-transition: border .2s linear;
    -o-transition: border .2s linear;
    -ms-transition: border .2s linear;
    transition: border .2s linear;
}

.pc .nextBtn .index a:hover:before {
    border-top: solid 1px #333739;
    border-bottom: solid 1px #333739;
}

.nextBtn .index a:after {
    content: "";
    display: block;
    width: 13px;
    height: 1px;
    left: 0;
    background-color: #fff;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    transition: background-color .2s linear;
}

.pager .pagination,.pc .nextBtn .index a:hover:after {
    background-color: #333739;
}

.pager .pagination {
    position: relative;
    height: 75px;
    padding: 20px 0 0;
    text-align: center;
}

.pager .pagination .page-numbers {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 35px;
    margin: 0 5px;
    overflow: hidden;
    line-height: 35px;
    color: #333739;
    background-color: #fff;
    border: 1px solid #fff;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -o-border-radius: 18px;
    -ms-border-radius: 18px;
    border-radius: 18px;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    transition: background-color .2s linear;
}

.pager .pagination a.page-numbers:link,.pager .pagination a.page-numbers:visited,.sp .pager .pagination a.page-numbers:active,.sp .pager .pagination a.page-numbers:hover {
    color: #ccc;
    background-color: transparent;
}

.pc .pager .pagination a.page-numbers:active,.pc .pager .pagination a.page-numbers:hover {
    color: #333739;
    background-color: #fff;
    text-decoration: none;
}

.pager .pagination .next,.pager .pagination .prev {
    text-indent: -9999px;
}

.pager .pagination .next:before,.pager .pagination .prev:before {
    content: "";
    position: absolute;
    display: block;
    width: 15px;
    height: 1px;
    top: 17px;
    left: 10px;
    background-color: #fff;
    -moz-transition: left .2s linear,background-color .2s linear;
    -webkit-transition: left .2s linear,background-color .2s linear;
    -o-transition: left .2s linear,background-color .2s linear;
    -ms-transition: left .2s linear,background-color .2s linear;
    transition: left .2s linear,background-color .2s linear;
}

.pc .pager .pagination .prev:hover:before {
    left: 8px;
    background-color: #333739;
}

.pc .pager .pagination .next:hover:before {
    left: 12px;
    background-color: #333739;
}

.pager .pagination .next:after,.pager .pagination .prev:after {
    content: "";
    position: absolute;
    display: block;
    width: 11px;
    height: 11px;
    top: 12px;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -moz-transition: border .2s linear,left .2s linear,right .2s linear;
    -webkit-transition: border .2s linear,left .2s linear,right .2s linear;
    -o-transition: border .2s linear,left .2s linear,right .2s linear;
    -ms-transition: border .2s linear,left .2s linear,right .2s linear;
    transition: border .2s linear,left .2s linear,right .2s linear;
}

.pager .pagination .prev:after {
    left: 10px;
    border-left: solid 1px #fff;
    border-bottom: solid 1px #fff;
}

.pager .pagination .next:after {
    right: 10px;
    border-right: solid 1px #fff;
    border-top: solid 1px #fff;
}

.pc .pager .pagination .prev:hover:after {
    left: 8px;
    border-left: solid 1px #333739;
    border-bottom: solid 1px #333739;
}

.pc .pager .pagination .next:hover:after {
    right: 8px;
    border-right: solid 1px #333739;
    border-top: solid 1px #333739;
}

.social {
    position: relative;
    height: 75px;
    padding: 27px 0 0;
    text-align: center;
    background-color: #333739;
    border-left: solid 1px #474c4e;
}

#modalContents,#modalLoader {
    position: absolute;
    right: 0;
    left: 0;
}

.social .facebook,.social .hatena,.social .twitter {
    display: inline-block;
    height: 20px;
    overflow: hidden;
}

.social .facebook {
    width: 110px;
}

.social .twitter {
    width: 80px;
}

.social .hatena {
    width: 69px;
}

#contentsDummy1 #map_canvas,#contentsDummy1 .social>div,#contentsDummy2 #map_canvas,#contentsDummy2 .social>div,#contentsDummy3 #map_canvas,#contentsDummy3 .social>div,#modalCover,#privacy {
    display: none;
}

.mail:before {
    content: "@";
}

.field1,.field2,.field3 {
    height: 2em;
    padding: 0 5px;
    border: 1px solid #ddd;
}

.field1 {
    width: 50%;
}

.field2 {
    width: 100%;
}

.field3 {
    width: 20%;
}

textarea.field2 {
    height: auto;
}

#map_canvas,.googleMap {
    height: 500px;
}

label {
    display: inline-block;
    padding: 0 0 0 5px;
}

label+input {
    margin: 0 0 0 20px;
}

.contentsBox table .radioList:last-child dd:last-child,.radioList dd {
    padding-left: 1em;
}

#privacyArea {
    margin: 0 0 30px;
}

#privacy {
    padding: 0 7% 10px;
    background-color: #f1f5f8;
}

.contentsBox .errorText {
    padding: 5px 0 0;
    color: #d7277a;
}

.googleMap {
    background-color: #e9e5dc;
}

#modalCover {
    position: fixed;
    z-index: 20000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
}

#modalLoader {
    width: 16px;
    height: 16px;
    top: 0;
    bottom: 0;
    margin: auto;
}

#modalContents {
    z-index: 20001;
    display: none;
    margin: auto;
    padding: 50px;
    text-align: center;
}

#modalContents .inner {
    position: relative;
    display: inline-block;
}

#modalContents .img {
    overflow: hidden;
    box-shadow: 0 0 35px rgba(0,0,0,.5);
    -moz-box-shadow: 0 0 35px rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 35px rgba(0,0,0,.5);
    -o-box-shadow: 0 0 35px rgba(0,0,0,.5);
    -ms-box-shadow: 0 0 35px rgba(0,0,0,.5);
}

#modalContents img {
    width: auto;
    max-width: 100%;
}

#modalContents video {
    float: left;
    background-color: #000;
}

#modalContents .btnClose a:after,#modalContents .btnClose a:before {
    position: absolute;
    background-color: #fff;
    display: block;
    content: "";
}

#modalContents iframe {
    float: left;
}

#modalContents .title p {
    padding: 15px 0 0;
    font-size: 90%;
    color: #fff;
    text-align: left;
}

#modalContents .title p span {
    padding-left: 1em;
}

#modalContents .btnClose {
    position: absolute;
    right: -5px;
    top: -45px;
}

#modalContents .btnClose a {
    display: block;
    width: 39px;
    height: 39px;
    right: 0;
    top: 0;
    text-indent: -9999px;
    overflow: hidden;
    opacity: .7;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -moz-transition: opacity .3s linear,-moz-transform .3s ease-in-out;
    -webkit-transition: opacity .3s linear,-webkit-transform .3s ease-in-out;
    -o-transition: opacity .3s linear,-o-transform .3s ease-in-out;
    -ms-transition: opacity .3s linear,-ms-transform .3s ease-in-out;
    transition: opacity .3s linear,transform .3s ease-in-out;
}

#modalContents .btnClose a:before {
    width: 39px;
    height: 1px;
    top: 19px;
    left: 0;
}

#modalContents .btnClose a:after {
    width: 1px;
    height: 39px;
    top: 0;
    left: 19px;
}

.pc #modalContents .btnClose a:hover {
    opacity: 1;
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
}

.youTube {
    max-width: 720px;
    max-height: 405px;
    margin: 0 auto;
    overflow: hidden;
}

#footerMenu,footer {
    margin: 0 0;
    /*margin: 0 -40px;*/
    overflow: hidden;
}

.youTube>div {
    position: relative;
    width: 100%;
    height: 0;
    padding: 56.25% 0 0;
}

.youTube iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

footer {
    position: relative;
    z-index: 4;
    padding: 40px 0 10px;
    /*padding: 40px 40px 10px;*/
    background-color: #212425;
}

#pageTop {
    position: absolute;
    width: 35px;
    top: 5px;
    right: 40px;
}

#pageTop a {
    display: block;
    height: 35px;
    overflow: hidden;
    text-indent: -9999px;
    border: 1px solid #fff;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -o-border-radius: 18px;
    -ms-border-radius: 18px;
    border-radius: 18px;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    transition: background-color .2s linear;
}

.pc #pageTop a:active,.pc #pageTop a:hover {
    background-color: #fff;
}

#pageTop a:before {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 15px;
    left: 17px;
    -moz-transition: top .2s linear,background-color .2s linear;
    -webkit-transition: top .2s linear,background-color .2s linear;
    -o-transition: top .2s linear,background-color .2s linear;
    -ms-transition: top .2s linear,background-color .2s linear;
    transition: top .2s linear,background-color .2s linear;
}

#pageTop a:link:before,#pageTop a:visited:before,.sp #pageTop a:active:before,.sp #pageTop a:hover:before {
    top: 10px;
    background-color: #fff;
}

.pc #pageTop a:active:before,.pc #pageTop a:hover:before {
    top: 8px;
    background-color: #333739;
}

#pageTop a:after {
    content: "";
    position: absolute;
    display: block;
    width: 11px;
    height: 11px;
    left: 12px;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -moz-transition: border .2s linear,top .2s linear;
    -webkit-transition: border .2s linear,top .2s linear;
    -o-transition: border .2s linear,top .2s linear;
    -ms-transition: border .2s linear,top .2s linear;
    transition: border .2s linear,top .2s linear;
}

#pageTop a:link:after,#pageTop a:visited:after,.sp #pageTop a:active:after,.sp #pageTop a:hover:after {
    top: 10px;
    border-left: solid 1px #fff;
    border-top: solid 1px #fff;
}

.pc #pageTop a:active:after,.pc #pageTop a:hover:after {
    top: 8px;
    border-left: solid 1px #333739;
    border-top: solid 1px #333739;
}

#footerMenu {
    padding: 0 40px;
}

#footerMenu .row {
    float: right;
    width: 60%;
    max-width: 800px;
    margin: 0 0 10px 40px;
}

#footerMenu .col {
    float: left;
    width: 33.33333333%;
    padding: 0 20px 0 0;
}

#footerMenu .col>ul>li {
    margin: 0 0 20px;
}

#footerMenu .col>ul>li>a {
    font-size: 83%;
    font-weight: 700;
}

#footerMenu .col>ul>li>.test {
    font-size: 83%;
    font-weight: 700;
    color: #fff;
}

#footerMenu .col>ul>li>a:link,#footerMenu .col>ul>li>a:visited,.sp #footerMenu .col>ul>li>a:active,.sp #footerMenu .col>ul>li>a:hover {
    color: #fff;
}

.pc #footerMenu .col>ul>li>a:active,.pc #footerMenu .col>ul>li>a:hover {
    color: #1ab6ff;
    text-decoration: none;
}

#footerMenu li li:first-of-type {
    margin: 5px 0 0;
}

#footerMenu .footerSubMenu li li:first-of-type {
    margin: 0;
}

#footerMenu li li a {
    font-size: 67%;
}

#footerMenu li li a:link,#footerMenu li li a:visited,.sp #footerMenu li li a:active,.sp #footerMenu li li a:hover {
    color: #999;
}

.pc #footerMenu li li a:active,.pc #footerMenu li li a:hover {
    color: #1ab6ff;
    text-decoration: none;
}

#footerMenu #footerAddress {
    font-size: 76%;
    color: #999;
}

#footerAddress p {
    padding: 0 0 80px;
}

#footerAddress .logo {
    padding: 0 0 15px;
}

#footerAddress .logo img {
    opacity: .5;
}

#footerAddress dl {
    padding: 0 0 30px;
}

#footerAddress dt {
    display: inline-block;
    margin: 0 10px 0 0;
}

#footerAddress dd {
    display: inline-block;
    margin: 0 20px 0 0;
}

#footerCopyright {
    position: absolute;
    bottom: 10px;
    left: 40px;
}

#footerCopyright small {
    font-size: 60%;
}

#footerCopyright p a:link,#footerCopyright p a:visited,.sp #footerCopyright p a:active,.sp #footerCopyright p a:hover {
    color: #707070;
}

.pc #footerCopyright p a:active,.pc #footerCopyright p a:hover {
    text-decoration: none;
    color: #1ab6ff;
}

#footerAddress address br,#footerCopyright br {
    display: none;
}

.topMainvisualArea {
    position: relative;
    overflow: hidden;
}

.topMainvisualArea .inner {
    width: 100%;
    overflow: hidden;
}

.topMainvisualArea section {
    float: left;
    display: none;
    width: 100%;
}

.topMainvisualArea section:first-of-type {
    display: block;
}

.topMainvisualArea section a {
    position: relative;
    display: block;
    width: 100%;
    background-color: #fff;
}

.sp .topMainvisualArea section a:active,.sp .topMainvisualArea section a:hover,.topMainvisualArea section a:link,.topMainvisualArea section a:visited {
    z-index: 1;
    color: #707070;
}

.pc .topMainvisualArea section a:active,.pc .topMainvisualArea section a:hover {
    z-index: 100;
    text-decoration: none;
    color: #707070;
}

.topMainvisualArea section a:after {
    content: "";
    display: block;
    clear: both;
}

.topMainvisualArea .imgArea {
    float: left;
    position: relative;
    width: 66.666666%;
    overflow: hidden;
}

.pc .topMainvisualArea .imgArea:before {
    content: "";
    position: absolute;
    z-index: 3;
    display: block;
    width: 101%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #000;
    opacity: 0;
    -moz-transition: opacity .3s ease-out;
    -webkit-transition: opacity .3s ease-out;
    -o-transition: .3s ease-out;
    -ms-transition: .3s ease-out;
    transition: .3s ease-out;
}

.pc .topMainvisualArea a:hover .imgArea:before {
    opacity: .6;
}

.pc .topMainvisualArea .imgArea:after {
    content: "制作実績を見る";
    position: absolute;
    z-index: 4;
    display: block;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 83%;
    line-height: 40px;
    color: #fff;
    text-align: center;
    border: 1px solid #fff;
    opacity: 0;
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    -moz-transition: -moz-transform .3s ease-out,opacity .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out,opacity .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out,opacity .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out;
}

.topMainvisualArea .icon,.topMainvisualArea .pagenation li span {
    overflow: hidden;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
}

.pc .topMainvisualArea a[target] .imgArea:after {
    content: "サイトを見る";
}

.pc .topMainvisualArea section a:hover .imgArea:after {
    opacity: 1;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.topMainvisualArea .imgArea .img {
    height: 18.5em;
    background-repeat: no-repeat;
    background-size: cover;
    -moz-transition: -moz-transform .3s ease-out;
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    -ms-transition: -ms-transform .3s ease-out;
    transition: transform .3s ease-out;
}

.pc .topMainvisualArea a:hover .imgArea .img {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.topMainvisualArea .icon {
    position: absolute;
    z-index: 2;
    width: 70px;
    height: 70px;
    top: 50%;
    left: 50%;
    margin: -35px 0 0 -35px;
    text-indent: -9999px;
    border-radius: 50%;
}

.topMainvisualArea .icon:before {
    position: absolute;
    display: block;
    width: 70px;
    top: 37px;
    left: 0;
    font-size: 10px;
    color: #fff;
    text-align: center;
    text-indent: 0;
}

.topMainvisualArea .icon:after {
    width: 40px;
    height: 40px;
    top: 5px;
    left: 15px;
}

.topMainvisualArea .iconPortfolio {
    background-color: #88c038;
}

.topMainvisualArea .iconPortfolio:before {
    content: "WORK";
    letter-spacing: .1em;
}

.topMainvisualArea .iconPortfolio:after {
    background-position: -80px 0;
}

.topMainvisualArea .textArea {
    float: right;
    position: relative;
    width: 33.333333%;
    height: 18.5em;
    padding: 30px 3.33333333% 0;
    text-align: center;
}

.topMainvisualArea h2 {
    position: relative;
    display: table-cell;
    width: 500px;
    height: 45px;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 90%;
    color: #000;
    line-height: 130%;
}

.topMainvisualArea section h2:after,.topMainvisualArea section h2:before {
    content: "";
    position: absolute;
    display: block;
    width: 100px;
    height: 1px;
    left: 50%;
    margin: 0 0 0 -50px;
    background-color: #000;
}

.topMainvisualArea section h2:before {
    top: 0;
}

.topMainvisualArea section h2:after {
    bottom: 0;
}

.topMainvisualArea .logo {
    padding: 0 0 10px;
    font-size: 76%;
}

.topMainvisualArea .text {
    padding: 15px 0 0;
    font-size: 76%;
}

.topMainvisualArea .btn {
    position: absolute;
    z-index: 101;
    width: 66.666666%;
    bottom: 0;
    left: 0;
}

.topMainvisualArea .btn li {
    position: absolute;
    width: 50px;
    bottom: 0;
}

.topMainvisualArea .btn .prev {
    right: 50px;
}

.topMainvisualArea .btn .next {
    right: 0;
}

.topMainvisualArea .btn li a {
    display: block;
    height: 50px;
    text-indent: -9999px;
    background-color: #fff;
    overflow: hidden;
}

.topMainvisualArea .btn .next a:after,.topMainvisualArea .btn .prev a:after {
    content: "";
    position: absolute;
    display: block;
    width: 15px;
    height: 15px;
    top: 18px;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.topMainvisualArea .btn .prev a:after {
    left: 21px;
    border-left: solid 1px #aaa;
    border-bottom: solid 1px #aaa;
    transition: left .2s linear,border .2s linear;
}

.topMainvisualArea .btn .next a:after {
    right: 21px;
    border-right: solid 1px #aaa;
    border-top: solid 1px #aaa;
    transition: right .2s linear,border .2s linear;
}

.pc .topMainvisualArea .btn .prev a:active:after,.pc .topMainvisualArea .btn .prev a:hover:after {
    left: 18px;
    border-left: solid 1px #3aaade;
    border-bottom: solid 1px #3aaade;
}

.pc .topMainvisualArea .btn .next a:active:after,.pc .topMainvisualArea .btn .next a:hover:after {
    right: 18px;
    border-right: solid 1px #3aaade;
    border-top: solid 1px #3aaade;
}

.topMainvisualArea .btn .prev a:before {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 30px;
    top: 10px;
    right: 0;
    background-color: #eee;
}

.topMainvisualArea .pagenation {
    position: absolute;
    z-index: 101;
    width: 66.666666%;
    height: 0;
    bottom: 0;
    left: 0;
    padding: 0 100px 0 0;
    text-align: center;
}

.spWebkit .topMainvisualArea .pagenation {
    padding: 0;
}

.topMainvisualArea .pagenation li {
    position: relative;
    display: inline-block;
    width: 10px;
    margin: 0 10px;
    vertical-align: top;
}

.topMainvisualArea .pagenation li.current {
    width: 20px;
    margin: 0 5px;
}

.topMainvisualArea .pagenation li:after,.topMainvisualArea .pagenation li:before {
    content: "";
    position: absolute;
    display: block;
    width: 10px;
    height: 1px;
    bottom: 25px;
    background-color: rgba(255,255,255,.3);
}

.topMainvisualArea .pagenation li:before {
    left: -10px;
}

.topMainvisualArea .pagenation li:after {
    right: -10px;
}

.topMainvisualArea .pagenation li.current:after,.topMainvisualArea .pagenation li.current:before {
    width: 5px;
}

.topMainvisualArea .pagenation li.current:before {
    left: -5px;
}

.topMainvisualArea .pagenation li.current:after {
    right: -5px;
}

.topMainvisualArea .pagenation li:first-of-type:before,.topMainvisualArea .pagenation li:last-of-type:after {
    display: none;
}

.topMainvisualArea .pagenation li span {
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    bottom: 20px;
    left: 0;
    text-indent: -9999px;
    background-color: #fff;
    border-radius: 50%;
}

.topMainvisualArea .pagenation li.current span {
    width: 20px;
    height: 20px;
    bottom: 15px;
    background-color: rgba(58,170,222,.6);
}

.topMainvisualArea .pagenation li.current span:after {
    content: "";
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    top: 5px;
    left: 5px;
    background-color: #3aaade;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.column .contentsBox h2,.news .contentsBox h2 {
    margin: 0 auto 20px;
    padding: 30px 0 10px;
    font-family: '游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 120%;
    font-weight: 700;
    color: #000;
    text-align: left;
    border-bottom: solid 1px #eee;
}

.column .contentsBox h2:first-of-type,.news .contentsBox h2:first-of-type {
    padding: 30px 0 10px;
}

#contactBox,#telBox {
    padding: 0;
    text-align: center;
    background-color: #fff;
    margin: 0 0 20px;
}

.column .time {
    padding-bottom: 0;
}

#contactBox {
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 200%;
}

#contactBox a {
    display: block;
    padding: 20px 0;
}

#contactBox a:link,#contactBox a:visited,.sp #contactBox a:active,.sp #contactBox a:hover {
    color: #dd3ca2;
}

.pc #contactBox a:active,.pc #contactBox a:hover {
    color: #f95dc0;
    text-decoration: none;
}

#telBox {
    display: block;
    font-family: 'Noto Sans Japanese','游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 90%;
    letter-spacing: .03em;
}

#telBox a {
    display: block;
    padding: 25px 0 20px;
    cursor: text;
}

#telBox a:active,#telBox a:hover,#telBox a:link,#telBox a:visited {
    color: #707070;
    text-decoration: none;
}

#telBox a:link span {
    display: block;
    padding: 0 0 5px;
    font-family: Open Sans,Century Gothic,Arial,Helvetica,sans-serif;
    font-size: 220%;
    letter-spacing: 0;
}

#telBox a:active span,#telBox a:hover span,#telBox a:link span,#telBox a:visited span {
    color: #dd3ca2;
}

.sitemap .contentsBox {
    padding-bottom: 40px;
}

.sitemap h2,.sitemap h2:first-of-type {
    padding: 30px 0 10px;
}

.sitemap h2 {
    margin: 0 0 20px;
    font-family: '游ゴシック体','Yu Gothic',YuGothic,'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
    font-size: 100%;
    font-weight: 700;
    color: #000;
    text-align: left;
    border-bottom: solid 1px #eee;
}

.sitemap ul,.sitemap ul li {
    padding-bottom: 0;
}

.sitemap ul li {
    padding-left: 0;
    font-weight: 700;
}

.sitemap ul li:after {
    display: none;
}

.sitemap ul li ul li {
    padding-left: 1.2em;
    font-weight: 400;
}

.sitemap ul li ul li:after {
    display: block;
}

.sitemap ul li a {
    display: inline-block;
    margin-bottom: 10px;
}

.sitemap ul li ul li a {
    margin-bottom: 0;
}

.sitemap ul li ul li:last-of-type a {
    margin-bottom: 10px;
}

.sitemap h2 a:link,.sitemap h2 a:visited,.sp .sitemap h2 a:active,.sp .sitemap h2 a:hover {
    color: #000;
}

.pc .sitemap h2 a:active,.pc .sitemap h2 a:hover {
    color: #1ab6ff;
}

#loading{
	margin-top:100px;
}

@media screen and (min-height:700px) and (min-width:1420px) {
    #pageTitle .copy,#pageTitle h1 {
        font-size: 210%;
    }
    #container {
        padding: 0 0 0 0;
    }

    #gnav {
        margin: 0 0 0 -140px;
    }

    #mainNav>li:nth-of-type(2)>a {
        top: 90px;
    }

    #mainNav>li:nth-of-type(3)>a {
        top: 180px;
    }

    #mainNav>li:nth-of-type(4)>a {
        top: 270px;
    }

    #mainNav>li:nth-of-type(5)>a {
        top: 360px;
    }

    #mainNav>li:nth-of-type(6)>a {
        top: 450px;
    }

    #mainNav>li>a {
        width: 100px;
        height: 90px;
        padding: 50px 0 0;
        font-size: 76%;
    }

    #mainNav>li>a:after {
        top: 10px;
        left: 30px;
    }

    #mainNav>li>ul {
        left: 100px;
    }

    #subNav a {
        left: 32px;
    }

    #subNavNews a {
        bottom: 182px;
    }

    #subNavEnglish a {
        bottom: 120px;
    }

    #bgImg,#bgImgDummy,#pageTitle {
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }

	#loading {
		margin-top:300px;
		margin-left:40%;
	}
}

@media screen and (min-width:1250px) and (max-width:1419px) {
    #bgImg,#bgImgDummy,#pageTitle {
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
	#loading {
		margin-top:300px;
		margin-left:40%;
	}
}

@media screen and (min-width:980px) and (max-width:1249px) {
    #bgImg,#bgImgDummy,#pageTitle {
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .col.half,.col.oneThird {
        float: none;
        width: auto;
    }

    .half.gutter:first-of-type {
        padding-right: 0;
    }

    .half.gutter:last-of-type {
        padding-left: 0;
    }

    .oneThird.gutter:first-of-type,.oneThird.gutter:last-of-type,.oneThird.gutter:nth-of-type(2) {
        padding-left: 0;
        padding-right: 0;
    }

    .hideNarrow {
        display: none;
    }

    .showNarrow {
        display: block;
    }

    br.showNarrow {
        display: inline;
    }

    #logo {
        width: 150px;
    }

    #logo a {
        height: 150px;
        padding: 40px 0 0 15px;
    }

    #logo p {
        margin: 0 0 15px;
    }

    #logo p:first-of-type img {
        width: 105px;
    }

    #logo p:last-of-type img {
        width: 122px;
    }

    .listBox2 section,.listBox3 section,.listBox4 section,.mainvisual2 .imgArea,.mainvisual2 .textArea,.tag li,.topMainvisualArea .btn,.topMainvisualArea .imgArea,.topMainvisualArea .pagenation,.topMainvisualArea .textArea {
        width: 50%;
    }

    #pageTitle .copy,#pageTitle h1 {
        font-size: 150%;
    }

    #pageTitle .copy br,#pageTitle h1 br {
        display: none;
    }

    #pageTitle .text {
        font-size: 90%;
    }

    .contentsBox>h2,.listBox4>h2 {
        font-size: 130%;
    }

    .tag li:nth-of-type(3n+1) {
        clear: none;
        padding-left: 10px;
    }

    .tag li:nth-of-type(2n+1) {
        clear: both;
        padding-left: 0;
    }

    .tag li:nth-of-type(3n) {
        padding-right: 10px;
    }

    .tag li:nth-of-type(2n) {
        padding-right: 0;
    }

    .imageList1 dt {
        font-size: 90%;
    }

    .imageList1 em {
        display: block;
        margin: 0 auto 15px;
        font-size: 350%;
    }

    .listBox3 section:nth-of-type(1) a {
        background-color: #588fe3;
    }

    .listBox3 section:nth-of-type(2) a,.listBox3 section:nth-of-type(3) a {
        background-color: #3aaade;
    }

    .listBox3 section:nth-of-type(4) a,.listBox3 section:nth-of-type(5) a {
        background-color: #27c0dc;
    }

    .listBox3 section:nth-of-type(6) a,.listBox3 section:nth-of-type(7) a {
        background-color: #02aa9f;
    }

    .listBox3 section:nth-of-type(8) a,.listBox3 section:nth-of-type(9) a {
        background-color: #219e62;
    }

    .listBox3 section:nth-of-type(10) a,.listBox3 section:nth-of-type(11) a {
        background-color: #629f44;
    }

    .listBox3 section:nth-of-type(12) a,.listBox3 section:nth-of-type(13) a {
        background-color: #899f44;
    }

    .contactList address {
        font-size: 83%;
    }

    #footerAddress address br {
        display: inline;
    }

    .topMainvisualArea .textArea {
        padding-left: 5%;
        padding-right: 5%;
    }
}
@media screen and (max-width:979px) {
	.t_disnone{
		display:none;
	}
	#pageTitle {
		left:20%;
	}
	#pageTitle .text,#pageTitle h1 {
		color:#fff;
		font-weight:bold;
	}

    #container,#gnav {
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
    }

    #footerAddress,#footerCopyright p,#subNav,#subNav a,#tagline {
        text-align: center;
    }

    #spGnavBtn,#spGnavBtn a,#tagline,header {
        position: absolute;
    }

    #gnav,.strength #spGnavBtn a,.strength #spGnavBtn:after,.strength #spGnavBtn:before,body {
        background-color: #111213;
    }

    #mainNav .spLocalNavBtn,#spGnavBtn a,#subNav a span {
        text-indent: -9999px;
        overflow: hidden;
    }

    .hideTablet {
        display: none;
    }

    .showTablet {
        display: block;
    }

    br.showTablet {
        display: inline;
    }

    #container {
        height: auto;
        margin: 0;
        padding: 0;
        transition: transform .3s ease-in-out;
    }

    #tagline {
        z-index: 5;
        width: 100%;
        height: auto;
        right: 0;
        bottom: 30px;
        padding: 0 15px;
        color: #707070;
    }

    #mainNav a:first-of-type:link,#mainNav a:first-of-type:visited,#subNav a:link,#subNav a:visited,.sp #mainNav a:first-of-type:active,.sp #mainNav a:first-of-type:hover,.sp #subNav a:active,.sp #subNav a:hover {
        color: #bbb;
    }

    .fadeOut #tagline,.spGnavPerspective #tagline {
        display: none;
    }

    header {
        top: 15px;
        left: 15px;
    }

    #logo {
        width: 150px;
    }

    #logo a {
        height: 150px;
        padding: 40px 0 0 15px;
    }

    #logo p {
        margin: 0 0 15px;
    }

    #logo p:first-of-type img {
        width: 105px;
    }

    #logo p:last-of-type img {
        width: 122px;
    }

    #spGnavBtn {
        z-index: 10001;
        display: block;
        width: 24px;
        height: 22px;
        top: 18px;
        right: 15px;
        padding: 10px 0;
        cursor: pointer;
        opacity: .7;
        -moz-transition: opacity .2s linear,right .3s ease-in-out;
        -webkit-transition: opacity .2s linear,right .3s ease-in-out;
        -o-transition: opacity .2s linear,right .3s ease-in-out;
        -ms-transition: opacity .2s linear,right .3s ease-in-out;
        transition: opacity .2s linear,right .3s ease-in-out;
    }

    #spGnavBtn:after,#spGnavBtn:before {
        content: "";
        position: absolute;
        z-index: 100;
        display: block;
        width: 24px;
        height: 2px;
        right: 0;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -webkit-transition: -webkit-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -o-transition: -o-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -ms-transition: -ms-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        transition: transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
    }

    #spGnavBtn:before {
        top: 0;
    }

    #spGnavBtn:after {
        bottom: 0;
    }

    .pc #spGnavBtn:hover {
        opacity: 1;
    }

    .pc #spGnavBtn:hover:before {
        width: 20px;
    }

    #spGnavBtn a {
        display: block;
        width: 24px;
        height: 2px;
        right: 0;
        background-color: #fff;
        -moz-transition: width .3s linear;
        -webkit-transition: width .3s linear;
        -o-transition: width .3s linear;
        -ms-transition: width .3s linear;
        transition: width .3s linear;
    }

    .pc #spGnavBtn:hover a {
        width: 15px;
    }

    .spGnavOpen #spGnavBtn:before {
        width: 24px !important;
        top: 10px;
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #gnav,#spGnavCover {
        top: 0;
        position: absolute;
    }

    .spGnavOpen #spGnavBtn:after {
        width: 24px !important;
        bottom: 10px;
        -moz-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .spGnavOpen #spGnavBtn a {
        width: 0;
    }

    .spGnavOpen #container {
        -moz-transform: translate3d(-265px,0,0);
        -webkit-transform: translate3d(-265px,0,0);
        -o-transform: translate3d(-265px,0,0);
        -ms-transform: translate3d(-265px,0,0);
        transform: translate3d(-265px,0,0);
    }

    .spGnavPerspective #container {
        height: 100%;
    }

    #gnav {
        width: 265px;
        right: 0;
        padding: 0 0 30px;
        overflow: hidden;
        transition: transform .3s ease-in-out;
    }

    .spGnavOpen #gnav {
        -moz-transform: translate3d(265px,0,0);
        -webkit-transform: translate3d(265px,0,0);
        -o-transform: translate3d(265px,0,0);
        -ms-transform: translate3d(265px,0,0);
        transform: translate3d(265px,0,0);
    }

    .spGnavPerspective #gnav {
        height: 100%;
        -moz-perspective: 1000px;
        -webkit-perspective: 1000px;
        -o-perspective: 1000px;
        -ms-perspective: 1000px;
        perspective: 1000px;
    }

    #gnav nav {
        -moz-transform: rotateY(-91deg);
        -webkit-transform: rotateY(-91deg);
        -o-transform: rotateY(-91deg);
        -ms-transform: rotateY(-91deg);
        transform: rotateY(-91deg);
        -moz-transform-origin: right top;
        -webkit-transform-origin: right top;
        -o-transform-origin: right top;
        -ms-transform-origin: right top;
        transform-origin: right top;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    .spGnavOpen #gnav nav {
        -moz-transform: rotateY(0);
        -webkit-transform: rotateY(0);
        -o-transform: rotateY(0);
        -ms-transform: rotateY(0);
        transform: rotateY(0);
    }

    #spGnavCover {
        z-index: 1;
        width: 100%;
        height: 100%;
        left: 0;
        background-color: #000;
        opacity: 0;
        -moz-transition: opacity .3s linear,z-index .3s linear;
        -webkit-transition: opacity .3s linear,z-index .3s linear;
        -o-transition: opacity .3s linear,z-index .3s linear;
        -ms-transition: opacity .3s linear,z-index .3s linear;
        transition: opacity .3s linear,z-index .3s linear;
    }

    .spGnavOpen #spGnavCover {
        z-index: 10000;
        opacity: .6;
    }

    #mainNav li {
        width: 265px;
        position: relative;
    }

    #mainNav a:first-of-type {
        position: relative;
        display: block;
        height: 60px;
        padding: 17px 15px 0 60px;
        font-size: 90%;
        overflow: hidden;
        -moz-transition: color .2s linear;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        -ms-transition: color .2s linear;
        transition: color .2s linear;
    }

    #mainNav .current>a:first-of-type,#mainNav .parent>a:first-of-type,.pc #mainNav a:first-of-type:active,.pc #mainNav a:first-of-type:hover {
        color: #fff;
        text-decoration: none;
    }

    #mainNav #gnavContact>a:first-of-type {
        background-color: #dd3ca2;
    }

    #mainNav #gnavContact>a:first-of-type:link,#mainNav #gnavContact>a:first-of-type:visited,.sp #mainNav #gnavContact>a:first-of-type:active,.sp #mainNav #gnavContact>a:first-of-type:hover {
        color: #f1b1da;
    }

    #mainNav #gnavContact.current>a:first-of-type,#mainNav #gnavContact.parent>a:first-of-type,.pc #mainNav #gnavContact>a:first-of-type:active,.pc #mainNav #gnavContact>a:first-of-type:hover {
        color: #fff;
    }

    #mainNav>li>a:first-of-type:after {
        content: "";
        position: absolute;
        display: block;
        width: 40px;
        height: 40px;
        top: 10px;
        left: 10px;
        background-image: url(../images/icon.png);
        background-repeat: no-repeat;
        -moz-background-size: 420px 940px;
        -webkit-background-size: 420px 940px;
        -o-background-size: 420px 940px;
        -ms-background-size: 420px 940px;
        background-size: 420px 940px;
        -moz-transition: opacity .2s linear;
        -webkit-transition: opacity .2s linear;
        -o-transition: opacity .2s linear;
        -ms-transition: opacity .2s linear;
        transition: opacity .2s linear;
    }

    #mainNav a:first-of-type span,#mainNav li ul {
        position: relative;
    }

    #mainNav a:first-of-type:before,#mainNav li ul:after {
        top: 0;
        content: "";
        display: block;
        position: absolute;
    }

    #mainNav>li>a:first-of-type:link:after,#mainNav>li>a:first-of-type:visited:after,.sp #mainNav>li>a:first-of-type:active:after,.sp #mainNav>li>a:first-of-type:hover:after {
        opacity: .5;
    }

    #mainNav>li.current>a:first-of-type:after,#mainNav>li.parent>a:first-of-type:after,.pc #mainNav>li>a:first-of-type:active:after,.pc #mainNav>li>a:first-of-type:hover:after {
        opacity: 1;
    }

    #mainNav #gnavContact>a:link:after,#mainNav #gnavContact>a:visited:after,.sp #mainNav #gnavContact>a:active:after,.sp #mainNav #gnavContact>a:hover:after {
        opacity: .7;
    }

    #mainNav #gnavContact.current>a:first-of-type:after,#mainNav #gnavContact.parent>a:first-of-type:after,.pc #mainNav #gnavContact>a:active:after,.pc #mainNav #gnavContact>a:hover:after {
        opacity: 1;
    }

    #gnavService>a:first-of-type:after {
        background-position: -40px 0;
    }

    #gnavPortfolio>a:first-of-type:after {
        background-position: -80px 0;
    }

    #gnavCompany>a:first-of-type:after {
        background-position: -120px 0;
    }

    #gnavRecruit>a:first-of-type:after {
        background-position: -160px 0;
    }

    #gnavColumn>a:first-of-type:after {
        background-position: -200px 0;
    }

    #gnavContact>a:first-of-type:after {
        background-position: -240px 0;
    }

    #mainNav a:first-of-type:before {
        width: 130%;
        height: 100%;
        left: 10%;
        background-color: #0090d4;
        opacity: .3;
        -moz-transform: translateX(-120%) skewX(15deg);
        -webkit-transform: translateX(-120%) skewX(15deg);
        -o-transform: translateX(-120%) skewX(15deg);
        -ms-transform: translateX(-120%) skewX(15deg);
        transform: translateX(-120%) skewX(15deg);
        -moz-transition: left .2s ease-in-out,opacity .2s linear;
        -webkit-transition: left .2s ease-in-out,opacity .2s linear;
        -o-transition: left .2s ease-in-out,opacity .2s linear;
        -ms-transition: left .2s ease-in-out,opacity .2s linear;
        transition: left .2s ease-in-out,opacity .2s linear;
    }

    #mainNav .current>a:first-of-type:before,.pc #mainNav a:first-of-type:hover:before {
        left: 140%;
        opacity: 1;
    }

    #mainNav .current.parent>a:first-of-type:before {
        left: 10%;
        opacity: .3;
    }

    #mainNav #gnavContact>a:before {
        background-color: #f95dc0;
    }

    #mainNav li ul {
        display: none;
    }

    #mainNav>li>ul {
        background-color: #252829;
    }

    #mainNav>li>ul>li>a:first-of-type {
        height: 55px;
        padding: 14px 15px 0 30px;
        font-size: 83%;
    }

    #mainNav>li>ul>li>ul {
        background-color: #333739;
    }

    #mainNav>li>ul>li>ul>li>a:first-of-type {
        height: 55px;
        padding: 14px 15px 0 45px;
        font-size: 83%;
    }

    #mainNav li ul:after {
        z-index: 2;
        width: 0;
        height: 0;
        left: 40px;
        border-top: solid 11px #111213;
        border-left: solid 11px transparent;
        border-right: solid 11px transparent;
    }

    #mainNav>li>ul>li>ul:after {
        border-top: solid 11px #252829;
    }

    #mainNav .spLocalNavBtn {
        position: absolute;
        width: 39px;
        height: 39px;
        right: 10px;
        top: 10px;
        border: 1px solid #fff;
        opacity: .7;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        -moz-transition: opacity .3s linear;
        -webkit-transition: opacity .3s linear;
        -o-transition: opacity .3s linear;
        -ms-transition: opacity .3s linear;
        transition: opacity .3s linear;
    }

    #mainNav .spLocalNavBtn:before {
        content: "";
        position: absolute;
        display: block;
        width: 17px;
        height: 1px;
        top: 18px;
        left: 10px;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        transition: transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
    }

    #mainNav .spLocalNavBtn:after {
        content: "";
        position: absolute;
        display: block;
        width: 1px;
        height: 17px;
        top: 10px;
        left: 18px;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    .pc #mainNav .spLocalNavBtn:hover {
        opacity: 1;
    }

    .pc #mainNav .spLocalNavBtn:hover:after,.pc #mainNav .spLocalNavBtn:hover:before {
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    #mainNav li ul .spLocalNavBtn {
        top: 8px;
    }

    #mainNav .spLocalNavOpen>.spLocalNavBtn:before {
        width: 0;
        left: 18px;
        -moz-transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg);
    }

    #mainNav .spLocalNavOpen>.spLocalNavBtn:after {
        -moz-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    .pc #mainNav .spLocalNavOpen>.spLocalNavBtn:hover:after {
        -moz-transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg);
    }

    #subNav li {
        display: inline-block;
        margin: 30px 10px 0;
    }

    #subNav a {
        display: block;
        width: 39px;
        height: 39px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.7);
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        -moz-transition: color .2s linear,background-color .2s,linear;
        -webkit-transition: color .2s linear,background-color .2s,linear;
        -o-transition: color .2s linear,background-color .2s,linear;
        -ms-transition: color .2s linear,background-color .2s,linear;
        transition: color .2s linear,background-color .2s,linear;
    }

    #subNavNews a:before {
        content: "NEWS";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 11px;
        line-height: 37px;
    }

    #subNavEnglish a:before {
        content: "ACT";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 13px;
        line-height: 37px;
    }

    .pc #subNav a:active,.pc #subNav a:hover {
        color: #111213;
        text-decoration: none;
        background-color: #fff;
    }

    #subNav a span {
        display: block;
    }

    #bgImg,#bgImgDummy {
        position: absolute;
        z-index: 2;
        height: 400px;
        margin: 0;
        padding: 0;
        top: auto;
    }

    #pageTitle {
        position: relative;
        height: 400px;
        margin: 0;
        padding: 180px 15px 0;
    }

    #pageTitle>div {
        padding: 0;
    }

    #loader2:before,#pageTitle>div:before {
        display: none;
    }

    #loader2 {
        top: 50px;
    }

    #pageTitle .textArea {
        display: table-cell;
        width: 980px;
        height: 13em;
        top: 0;
        padding: 0;
        vertical-align: middle;
    }

    #pageTitle .copy,#pageTitle h1 {
        font-size: 150%;
    }

    #breadCrumb2,#pageTitle .copy br {
        display: none;
    }

    .fadeOut #container,.fadeOut #contentsArea {
        height: 100%;
    }

    #contentsArea {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    #contactBox,#privacyArea,#telBox,.contentsBox #btnPrivacy,.contentsBox .row,.contentsBox>dl,.contentsBox>form>table,.contentsBox>h2,.contentsBox>ol,.contentsBox>p,.contentsBox>table,.contentsBox>ul,.listBox2>h2,.listBox4>h2,.listBox5>h2,.mainvisual1 .text,.mainvisual1 h1,.sectionBox1 {
        margin-left: auto;
        margin-right: auto;
        max-width: 720px;
    }

    #contentsDummy1,#contentsDummy2,#contentsDummy3 {
        top: 0;
    }

    .tag {
        padding: 30px 5% 15px;
    }

    .mainvisual1 {
        padding: 40px 5%;
    }

    .contentsBox {
        padding: 40px 5% 20px;
    }

    .listBox2>h2,.listBox4>h2,.listBox5>h2 {
        padding: 40px 5%;
    }

    .listBox2,.tag+.listBox4 {
        background-color: #fff;
    }

    footer {
        margin: 0;
        padding: 30px 5% 50px;
    }

    #pageTop {
        z-index: 2;
        top: 30px;
        right: 5%;
    }

    #footerAddress {
        max-width: 720px;
        margin: 0 auto;
    }

    #footerAddress p {
        padding: 0 0 30px;
    }

    #footerAddress .logo {
        padding: 0 0 15px;
    }

    #footerAddress address,#footerAddress dd:last-of-type,#footerAddress dl {
        margin: 0;
    }

    #footerMenu .row {
        float: none;
        width: auto;
        max-width: none;
        margin: 0;
    }

    #footerMenu .col {
        float: none;
        display: block;
        width: auto;
        padding: 0;
    }

    #footerMenu ul {
        display: none;
    }

    #footerMenu .footerSubMenu,#footerMenu .footerSubMenu ul {
        display: block;
        text-align: center;
    }

    #footerMenu .footerSubMenu ul li {
        display: inline-block;
        padding: 0 10px;
    }

    #footerCopyright {
        position: static;
    }

    #footerCopyright p {
        margin: 0 0 15px;
        line-height: 100%;
    }
}

@media print {
	.t_disnone{
		display:none;
	}
	#pageTitle {
		left:20%;
	}
	#pageTitle .text,#pageTitle h1 {
		color:#fff;
		font-weight:bold;
	}

    #container,#gnav {
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
    }

    #footerAddress,#footerCopyright p,#subNav,#subNav a,#tagline {
        text-align: center;
    }

    #spGnavBtn,#spGnavBtn a,#tagline,header {
        position: absolute;
    }

    #gnav,.strength #spGnavBtn a,.strength #spGnavBtn:after,.strength #spGnavBtn:before,body {
        background-color: #111213;
    }

    #mainNav .spLocalNavBtn,#spGnavBtn a,#subNav a span {
        text-indent: -9999px;
        overflow: hidden;
    }

    .hideTablet {
        display: none;
    }

    .showTablet {
        display: block;
    }

    br.showTablet {
        display: inline;
    }

    #container {
        height: auto;
        margin: 0;
        padding: 0;
        transition: transform .3s ease-in-out;
    }

    #tagline {
        z-index: 5;
        width: 100%;
        height: auto;
        right: 0;
        bottom: 30px;
        padding: 0 15px;
        color: #707070;
    }

    #mainNav a:first-of-type:link,#mainNav a:first-of-type:visited,#subNav a:link,#subNav a:visited,.sp #mainNav a:first-of-type:active,.sp #mainNav a:first-of-type:hover,.sp #subNav a:active,.sp #subNav a:hover {
        color: #bbb;
    }

    .fadeOut #tagline,.spGnavPerspective #tagline {
        display: none;
    }

    header {
        top: 15px;
        left: 15px;
    }

    #logo {
        width: 150px;
    }

    #logo a {
        height: 150px;
        padding: 40px 0 0 15px;
    }

    #logo p {
        margin: 0 0 15px;
    }

    #logo p:first-of-type img {
        width: 105px;
    }

    #logo p:last-of-type img {
        width: 122px;
    }

    #spGnavBtn {
        z-index: 10001;
        display: block;
        width: 24px;
        height: 22px;
        top: 18px;
        right: 15px;
        padding: 10px 0;
        cursor: pointer;
        opacity: .7;
        -moz-transition: opacity .2s linear,right .3s ease-in-out;
        -webkit-transition: opacity .2s linear,right .3s ease-in-out;
        -o-transition: opacity .2s linear,right .3s ease-in-out;
        -ms-transition: opacity .2s linear,right .3s ease-in-out;
        transition: opacity .2s linear,right .3s ease-in-out;
    }

    #spGnavBtn:after,#spGnavBtn:before {
        content: "";
        position: absolute;
        z-index: 100;
        display: block;
        width: 24px;
        height: 2px;
        right: 0;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -webkit-transition: -webkit-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -o-transition: -o-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        -ms-transition: -ms-transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
        transition: transform .3s ease-in-out,top .3s linear,bottom .3s linear,width .3s linear;
    }

    #spGnavBtn:before {
        top: 0;
    }

    #spGnavBtn:after {
        bottom: 0;
    }

    .pc #spGnavBtn:hover {
        opacity: 1;
    }

    .pc #spGnavBtn:hover:before {
        width: 20px;
    }

    #spGnavBtn a {
        display: block;
        width: 24px;
        height: 2px;
        right: 0;
        background-color: #fff;
        -moz-transition: width .3s linear;
        -webkit-transition: width .3s linear;
        -o-transition: width .3s linear;
        -ms-transition: width .3s linear;
        transition: width .3s linear;
    }

    .pc #spGnavBtn:hover a {
        width: 15px;
    }

    .spGnavOpen #spGnavBtn:before {
        width: 24px !important;
        top: 10px;
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #gnav,#spGnavCover {
        top: 0;
        position: absolute;
    }

    .spGnavOpen #spGnavBtn:after {
        width: 24px !important;
        bottom: 10px;
        -moz-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .spGnavOpen #spGnavBtn a {
        width: 0;
    }

    .spGnavOpen #container {
        -moz-transform: translate3d(-265px,0,0);
        -webkit-transform: translate3d(-265px,0,0);
        -o-transform: translate3d(-265px,0,0);
        -ms-transform: translate3d(-265px,0,0);
        transform: translate3d(-265px,0,0);
    }

    .spGnavPerspective #container {
        height: 100%;
    }

    #gnav {
        width: 265px;
        right: 0;
        padding: 0 0 30px;
        overflow: hidden;
        transition: transform .3s ease-in-out;
    }

    .spGnavOpen #gnav {
        -moz-transform: translate3d(265px,0,0);
        -webkit-transform: translate3d(265px,0,0);
        -o-transform: translate3d(265px,0,0);
        -ms-transform: translate3d(265px,0,0);
        transform: translate3d(265px,0,0);
    }

    .spGnavPerspective #gnav {
        height: 100%;
        -moz-perspective: 1000px;
        -webkit-perspective: 1000px;
        -o-perspective: 1000px;
        -ms-perspective: 1000px;
        perspective: 1000px;
    }

    #gnav nav {
        -moz-transform: rotateY(-91deg);
        -webkit-transform: rotateY(-91deg);
        -o-transform: rotateY(-91deg);
        -ms-transform: rotateY(-91deg);
        transform: rotateY(-91deg);
        -moz-transform-origin: right top;
        -webkit-transform-origin: right top;
        -o-transform-origin: right top;
        -ms-transform-origin: right top;
        transform-origin: right top;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    .spGnavOpen #gnav nav {
        -moz-transform: rotateY(0);
        -webkit-transform: rotateY(0);
        -o-transform: rotateY(0);
        -ms-transform: rotateY(0);
        transform: rotateY(0);
    }

    #spGnavCover {
        z-index: 1;
        width: 100%;
        height: 100%;
        left: 0;
        background-color: #000;
        opacity: 0;
        -moz-transition: opacity .3s linear,z-index .3s linear;
        -webkit-transition: opacity .3s linear,z-index .3s linear;
        -o-transition: opacity .3s linear,z-index .3s linear;
        -ms-transition: opacity .3s linear,z-index .3s linear;
        transition: opacity .3s linear,z-index .3s linear;
    }

    .spGnavOpen #spGnavCover {
        z-index: 10000;
        opacity: .6;
    }

    #mainNav li {
        width: 265px;
        position: relative;
    }

    #mainNav a:first-of-type {
        position: relative;
        display: block;
        height: 60px;
        padding: 17px 15px 0 60px;
        font-size: 90%;
        overflow: hidden;
        -moz-transition: color .2s linear;
        -webkit-transition: color .2s linear;
        -o-transition: color .2s linear;
        -ms-transition: color .2s linear;
        transition: color .2s linear;
    }

    #mainNav .current>a:first-of-type,#mainNav .parent>a:first-of-type,.pc #mainNav a:first-of-type:active,.pc #mainNav a:first-of-type:hover {
        color: #fff;
        text-decoration: none;
    }

    #mainNav #gnavContact>a:first-of-type {
        background-color: #dd3ca2;
    }

    #mainNav #gnavContact>a:first-of-type:link,#mainNav #gnavContact>a:first-of-type:visited,.sp #mainNav #gnavContact>a:first-of-type:active,.sp #mainNav #gnavContact>a:first-of-type:hover {
        color: #f1b1da;
    }

    #mainNav #gnavContact.current>a:first-of-type,#mainNav #gnavContact.parent>a:first-of-type,.pc #mainNav #gnavContact>a:first-of-type:active,.pc #mainNav #gnavContact>a:first-of-type:hover {
        color: #fff;
    }

    #mainNav>li>a:first-of-type:after {
        content: "";
        position: absolute;
        display: block;
        width: 40px;
        height: 40px;
        top: 10px;
        left: 10px;
        background-image: url(../images/icon.png);
        background-repeat: no-repeat;
        -moz-background-size: 420px 940px;
        -webkit-background-size: 420px 940px;
        -o-background-size: 420px 940px;
        -ms-background-size: 420px 940px;
        background-size: 420px 940px;
        -moz-transition: opacity .2s linear;
        -webkit-transition: opacity .2s linear;
        -o-transition: opacity .2s linear;
        -ms-transition: opacity .2s linear;
        transition: opacity .2s linear;
    }

    #mainNav a:first-of-type span,#mainNav li ul {
        position: relative;
    }

    #mainNav a:first-of-type:before,#mainNav li ul:after {
        top: 0;
        content: "";
        display: block;
        position: absolute;
    }

    #mainNav>li>a:first-of-type:link:after,#mainNav>li>a:first-of-type:visited:after,.sp #mainNav>li>a:first-of-type:active:after,.sp #mainNav>li>a:first-of-type:hover:after {
        opacity: .5;
    }

    #mainNav>li.current>a:first-of-type:after,#mainNav>li.parent>a:first-of-type:after,.pc #mainNav>li>a:first-of-type:active:after,.pc #mainNav>li>a:first-of-type:hover:after {
        opacity: 1;
    }

    #mainNav #gnavContact>a:link:after,#mainNav #gnavContact>a:visited:after,.sp #mainNav #gnavContact>a:active:after,.sp #mainNav #gnavContact>a:hover:after {
        opacity: .7;
    }

    #mainNav #gnavContact.current>a:first-of-type:after,#mainNav #gnavContact.parent>a:first-of-type:after,.pc #mainNav #gnavContact>a:active:after,.pc #mainNav #gnavContact>a:hover:after {
        opacity: 1;
    }

    #gnavService>a:first-of-type:after {
        background-position: -40px 0;
    }

    #gnavPortfolio>a:first-of-type:after {
        background-position: -80px 0;
    }

    #gnavCompany>a:first-of-type:after {
        background-position: -120px 0;
    }

    #gnavRecruit>a:first-of-type:after {
        background-position: -160px 0;
    }

    #gnavColumn>a:first-of-type:after {
        background-position: -200px 0;
    }

    #gnavContact>a:first-of-type:after {
        background-position: -240px 0;
    }

    #mainNav a:first-of-type:before {
        width: 130%;
        height: 100%;
        left: 10%;
        background-color: #0090d4;
        opacity: .3;
        -moz-transform: translateX(-120%) skewX(15deg);
        -webkit-transform: translateX(-120%) skewX(15deg);
        -o-transform: translateX(-120%) skewX(15deg);
        -ms-transform: translateX(-120%) skewX(15deg);
        transform: translateX(-120%) skewX(15deg);
        -moz-transition: left .2s ease-in-out,opacity .2s linear;
        -webkit-transition: left .2s ease-in-out,opacity .2s linear;
        -o-transition: left .2s ease-in-out,opacity .2s linear;
        -ms-transition: left .2s ease-in-out,opacity .2s linear;
        transition: left .2s ease-in-out,opacity .2s linear;
    }

    #mainNav .current>a:first-of-type:before,.pc #mainNav a:first-of-type:hover:before {
        left: 140%;
        opacity: 1;
    }

    #mainNav .current.parent>a:first-of-type:before {
        left: 10%;
        opacity: .3;
    }

    #mainNav #gnavContact>a:before {
        background-color: #f95dc0;
    }

    #mainNav li ul {
        display: none;
    }

    #mainNav>li>ul {
        background-color: #252829;
    }

    #mainNav>li>ul>li>a:first-of-type {
        height: 55px;
        padding: 14px 15px 0 30px;
        font-size: 83%;
    }

    #mainNav>li>ul>li>ul {
        background-color: #333739;
    }

    #mainNav>li>ul>li>ul>li>a:first-of-type {
        height: 55px;
        padding: 14px 15px 0 45px;
        font-size: 83%;
    }

    #mainNav li ul:after {
        z-index: 2;
        width: 0;
        height: 0;
        left: 40px;
        border-top: solid 11px #111213;
        border-left: solid 11px transparent;
        border-right: solid 11px transparent;
    }

    #mainNav>li>ul>li>ul:after {
        border-top: solid 11px #252829;
    }

    #mainNav .spLocalNavBtn {
        position: absolute;
        width: 39px;
        height: 39px;
        right: 10px;
        top: 10px;
        border: 1px solid #fff;
        opacity: .7;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        -moz-transition: opacity .3s linear;
        -webkit-transition: opacity .3s linear;
        -o-transition: opacity .3s linear;
        -ms-transition: opacity .3s linear;
        transition: opacity .3s linear;
    }

    #mainNav .spLocalNavBtn:before {
        content: "";
        position: absolute;
        display: block;
        width: 17px;
        height: 1px;
        top: 18px;
        left: 10px;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
        transition: transform .3s ease-in-out,width .3s ease-in-out,left .3s ease-in-out;
    }

    #mainNav .spLocalNavBtn:after {
        content: "";
        position: absolute;
        display: block;
        width: 1px;
        height: 17px;
        top: 10px;
        left: 18px;
        background-color: #fff;
        -moz-transition: -moz-transform .3s ease-in-out;
        -webkit-transition: -webkit-transform .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out;
        -ms-transition: -ms-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
    }

    .pc #mainNav .spLocalNavBtn:hover {
        opacity: 1;
    }

    .pc #mainNav .spLocalNavBtn:hover:after,.pc #mainNav .spLocalNavBtn:hover:before {
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    #mainNav li ul .spLocalNavBtn {
        top: 8px;
    }

    #mainNav .spLocalNavOpen>.spLocalNavBtn:before {
        width: 0;
        left: 18px;
        -moz-transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg);
    }

    #mainNav .spLocalNavOpen>.spLocalNavBtn:after {
        -moz-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    .pc #mainNav .spLocalNavOpen>.spLocalNavBtn:hover:after {
        -moz-transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg);
    }

    #subNav li {
        display: inline-block;
        margin: 30px 10px 0;
    }

    #subNav a {
        display: block;
        width: 39px;
        height: 39px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.7);
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        -moz-transition: color .2s linear,background-color .2s,linear;
        -webkit-transition: color .2s linear,background-color .2s,linear;
        -o-transition: color .2s linear,background-color .2s,linear;
        -ms-transition: color .2s linear,background-color .2s,linear;
        transition: color .2s linear,background-color .2s,linear;
    }

    #subNavNews a:before {
        content: "NEWS";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 11px;
        line-height: 37px;
    }

    #subNavEnglish a:before {
        content: "ACT";
        font-family: Open Sans,Arial,Helvetica,sans-serif;
        font-size: 13px;
        line-height: 37px;
    }

    .pc #subNav a:active,.pc #subNav a:hover {
        color: #111213;
        text-decoration: none;
        background-color: #fff;
    }

    #subNav a span {
        display: block;
    }

    #bgImg,#bgImgDummy {
        position: absolute;
        z-index: 2;
        height: 400px;
        margin: 0;
        padding: 0;
        top: auto;
    }

    #pageTitle {
        position: relative;
        height: 400px;
        margin: 0;
        padding: 180px 15px 0;
    }

    #pageTitle>div {
        padding: 0;
    }

    #loader2:before,#pageTitle>div:before {
        display: none;
    }

    #loader2 {
        top: 50px;
    }

    #pageTitle .textArea {
        display: table-cell;
        width: 980px;
        height: 13em;
        top: 0;
        padding: 0;
        vertical-align: middle;
    }

    #pageTitle .copy,#pageTitle h1 {
        font-size: 150%;
    }

    #breadCrumb2,#pageTitle .copy br {
        display: none;
    }

    .fadeOut #container,.fadeOut #contentsArea {
        height: 100%;
    }

    #contentsArea {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    #contactBox,#privacyArea,#telBox,.contentsBox #btnPrivacy,.contentsBox .row,.contentsBox>dl,.contentsBox>form>table,.contentsBox>h2,.contentsBox>ol,.contentsBox>p,.contentsBox>table,.contentsBox>ul,.listBox2>h2,.listBox4>h2,.listBox5>h2,.mainvisual1 .text,.mainvisual1 h1,.sectionBox1 {
        margin-left: auto;
        margin-right: auto;
        max-width: 720px;
    }

    #contentsDummy1,#contentsDummy2,#contentsDummy3 {
        top: 0;
    }

    .tag {
        padding: 30px 5% 15px;
    }

    .mainvisual1 {
        padding: 40px 5%;
    }

    .contentsBox {
        padding: 40px 5% 20px;
    }

    .listBox2>h2,.listBox4>h2,.listBox5>h2 {
        padding: 40px 5%;
    }

    .listBox2,.tag+.listBox4 {
        background-color: #fff;
    }

    footer {
        margin: 0;
        padding: 30px 5% 50px;
    }

    #pageTop {
        z-index: 2;
        top: 30px;
        right: 5%;
    }

    #footerAddress {
        max-width: 720px;
        margin: 0 auto;
    }

    #footerAddress p {
        padding: 0 0 30px;
    }

    #footerAddress .logo {
        padding: 0 0 15px;
    }

    #footerAddress address,#footerAddress dd:last-of-type,#footerAddress dl {
        margin: 0;
    }

    #footerMenu .row {
        float: none;
        width: auto;
        max-width: none;
        margin: 0;
    }

    #footerMenu .col {
        float: none;
        display: block;
        width: auto;
        padding: 0;
    }

    #footerMenu ul {
        display: none;
    }

    #footerMenu .footerSubMenu,#footerMenu .footerSubMenu ul {
        display: block;
        text-align: center;
    }

    #footerMenu .footerSubMenu ul li {
        display: inline-block;
        padding: 0 10px;
    }

    #footerCopyright {
        position: static;
    }

    #footerCopyright p {
        margin: 0 0 15px;
        line-height: 100%;
    }

	.cbp-af-header {
		position: absolute;
		overflow: visible;
	}

	.cbp-af-header .cbp-af-inner {
		width: 1240px;
		margin:0;
		overflow: visible;
		zoom: 0.83;
	}

	.listBox4 section {
		height:480px;
	}
}

@media screen and (max-width:719px) {
    .col.half,.col.oneThird {
        float: none;
        width: auto;
    }

    .half.gutter:first-of-type {
        padding-right: 0;
    }

    .half.gutter:last-of-type {
        padding-left: 0;
    }

    .contentsBox .serviceList li,.listBox2 section,.listBox3 section,.listBox4 section,.mainvisual2 .imgArea,.mainvisual2 .textArea,.tag li,.topMainvisualArea .btn,.topMainvisualArea .imgArea,.topMainvisualArea .pagenation,.topMainvisualArea .textArea {
        width: 50%;
    }

    .oneThird.gutter:first-of-type,.oneThird.gutter:last-of-type,.oneThird.gutter:nth-of-type(2) {
        padding-left: 0;
        padding-right: 0;
    }

    .hideFablet,.hideNarrow {
        display: none;
    }

    .showFablet,.showNarrow {
        display: block;
    }

    br.showFablet,br.showNarrow {
        display: inline;
    }

    #pageTitle .copy,#pageTitle h1 {
        font-size: 150%;
    }

    #pageTitle .copy br,#pageTitle h1 br {
        display: none;
    }

    #pageTitle .text {
        font-size: 90%;
    }

    .contentsBox>h2,.listBox4>h2 {
        font-size: 130%;
    }

    .tag li:nth-of-type(3n+1) {
        clear: none;
        padding-left: 10px;
    }

    .tag li:nth-of-type(2n+1) {
        clear: both;
        padding-left: 0;
    }

    .tag li:nth-of-type(3n) {
        padding-right: 10px;
    }

    .tag li:nth-of-type(2n) {
        padding-right: 0;
    }

    .imageList1 dt {
        font-size: 90%;
    }

    .imageList1 em {
        display: block;
        margin: 0 auto 15px;
        font-size: 350%;
    }

    .contactList address,.tabNav li {
        font-size: 76%;
    }

    .listBox3 section:nth-of-type(1) a {
        background-color: #588fe3;
    }

    .listBox3 section:nth-of-type(2) a,.listBox3 section:nth-of-type(3) a {
        background-color: #3aaade;
    }

    .listBox3 section:nth-of-type(4) a,.listBox3 section:nth-of-type(5) a {
        background-color: #27c0dc;
    }

    .listBox3 section:nth-of-type(6) a,.listBox3 section:nth-of-type(7) a {
        background-color: #02aa9f;
    }

    .listBox3 section:nth-of-type(8) a,.listBox3 section:nth-of-type(9) a {
        background-color: #219e62;
    }

    .listBox3 section:nth-of-type(10) a,.listBox3 section:nth-of-type(11) a {
        background-color: #629f44;
    }

    .listBox3 section:nth-of-type(12) a,.listBox3 section:nth-of-type(13) a {
        background-color: #899f44;
    }

    .tabNav li a {
        padding: 0 10px;
    }

    #modalContents .btnClose {
        right: 15px;
    }

    #modalContents {
        padding: 50px 0;
    }

    #modalContents .title p {
        padding-left: 20px;
    }

    .topMainvisualArea .textArea {
        padding-left: 5%;
        padding-right: 5%;
    }

}
@media screen and (max-width:479px) {
    #bgImg,#bgImgDummy,#pageTitle {
        height: 300px;
    }

    .contactList .btnLarge span,p.btnLarge span {
        max-width: none;
    }

    .hideSP {
        display: none;
    }

    .showSP {
        display: block;
    }

    br.showSP {
        display: inline;
    }

    #logo {
        width: auto;
    }

    #logo a {
        width: 90px;
        height: 90px;
        padding: 0;
    }

    #logo p:first-of-type {
        margin: 0;
        padding: 30px 0 0;
        text-align: center;
    }

    #logo p:last-of-type {
        display: none;
    }

    #logo p:first-of-type img {
        width: 70px;
        vertical-align: middle;
    }

    #spGnavBtn+label {
        top: 15px;
    }

    #pageTitle {
        padding: 110px 15px 0;
    }

    #pageTitle .textArea {
        height: 11.5em;
    }

    #pageTitle .copy,#pageTitle h1 {
        margin: 0 0 15px;
        font-size: 110%;
    }

    #pageTitle .list {
        margin: 0 0 15px;
    }

    #pageTitle .list li {
        margin: 0;
        font-size: 76%;
    }

    .listBox3 .text,.mainvisual2 .text {
        font-size: 83%;
    }

    #pageTitle .btn {
        display: block;
    }

    .sectionBox1 h3 br,.sectionBox1:after {
        display: none;
    }

    #container {
        min-width: 320px;
    }

    .mainvisual2 .imgArea,.mainvisual2 .textArea {
        float: none;
        width: auto;
    }

    .mainvisual2 .imgArea .img {
        height: 0;
        padding: 60.4166666% 0 0;
    }

    .mainvisual2 .textArea {
        height: auto;
        padding: 20px 5%;
    }

    .listBox1 section a {
        min-height: 150px;
    }

    .listBox1 .icon:before,.listBox1 .img {
        width: 120px;
    }

    .listBox1 .img span {
        width: 90px;
        height: 90px;
    }

    .listBox1 img {
        width: 146px;
        height: 90px;
        margin: 0 0 0 -73px;
    }

    .listBox1 .textArea {
        width: auto;
        padding: 20px 5% 20px 0;
    }

    .listBox1 .icon:after {
        left: 10px;
        margin: auto 0;
    }

    .listBox2 section {
        float: none;
        width: auto;
    }

    .listBox2 section a {
        height: 16em;
    }

    .listBox2 .icon:after {
        height: 40px;
        -moz-background-size: 420px 940px;
        -webkit-background-size: 420px 940px;
        -o-background-size: 420px 940px;
        -ms-background-size: 420px 940px;
        background-size: 420px 940px;
    }

    .listBox2 .textArea {
        padding: 40px 0 0;
    }

    .listBox2 section h2 {
        padding: 0 5% 10px;
    }

    .listBox3 section {
        float: none;
        width: auto;
    }

    .listBox3 a {
        height: 16em;
        padding: 100px 5% 0;
    }

    .listBox3 a:after {
        top: 20px;
        margin: 0 0 0 -50px;
    }

    .listBox3 section:nth-of-type(1) a {
        background-color: #588fe3;
    }

    .listBox3 section:nth-of-type(2) a {
        background-color: #3aaade;
    }

    .listBox3 section:nth-of-type(3) a {
        background-color: #27c0dc;
    }

    .listBox3 section:nth-of-type(4) a {
        background-color: #02aa9f;
    }

    .listBox3 section:nth-of-type(5) a {
        background-color: #219e62;
    }

    .listBox3 section:nth-of-type(6) a {
        background-color: #629f44;
    }

    .listBox3 section:nth-of-type(7) a {
        background-color: #899f44;
    }

    .listBox3 section:nth-of-type(8) a {
        background-color: #b1aa33;
    }

    .listBox3 section:nth-of-type(9) a {
        background-color: #c9ad3a;
    }

    .listBox3 section:nth-of-type(10) a {
        background-color: #cb952d;
    }

    .listBox3 section:nth-of-type(11) a {
        background-color: #588fe3;
    }

    .listBox3 section:nth-of-type(12) a {
        background-color: #3aaade;
    }

    .listBox4 section {
        float: none;
        width: auto;
    }

    .listBox4 section a {
        height: auto;
    }

    .listBox4 section>a h2,.listBox4 section>a h3 {
        padding: 10px 5% 5px;
    }

    .listBox4 .text {
        padding: 0 5% 25px;
    }

    .listBox5 .imgArea {
        position: relative;
        width: auto;
        height: 200px;
        min-height: auto;
    }

    .listBox5 .title {
        height: 200px;
        padding: 20px 5%;
    }

    .listBox5 .textArea {
        width: auto;
    }

    .listBox5 .text {
        height: auto;
        padding: 20px 5%;
    }

    .icon:after {
        width: 100px;
        height: 70px;
        background-size: 300px 671px;
    }

    .iconSmart4meBiz:after {
        background-position: 0 -29px;
    }

    .iconSmart4me:after {
        background-position: -100px -29px;
    }

    .iconCrossMedia:after {
        background-position: -200px -29px;
    }

    .iconRWD:after {
        background-position: 0 -100px;
    }

    .iconSP:after {
        background-position: -100px -100px;
    }

    .iconLarge:after {
        background-position: -200px -100px;
    }

    .iconSystem:after {
        background-position: 0 -171px;
    }

    .iconInternational:after {
        background-position: -100px -171px;
    }

    .iconRecruitTool:after {
        background-position: -200px -171px;
    }

    .iconResearch:after {
        background-position: 0 -243px;
    }

    .iconSEO:after {
        background-position: -100px -243px;
    }

    .iconTranslation:after {
        background-position: -200px -243px;
    }

    .iconWeb:after {
        background-position: 0 -314px;
    }

    .iconGraphic:after {
        background-position: -100px -314px;
    }

    .iconMovie:after {
        background-position: -200px -314px;
    }

    .iconCorporate:after {
        background-position: 0 -386px;
    }

    .iconCompany:after {
        background-position: -100px -386px;
    }

    .iconPhilosophy:after {
        background-position: -200px -386px;
    }

    .iconAccess:after {
        background-position: 0 -457px;
    }

    .iconNews:after {
        background-position: -100px -457px;
    }

    .iconRecruitInfo:after {
        background-position: -200px -457px;
    }

    .iconMessage:after {
        background-position: 0 -529px;
    }

    .iconStaff:after {
        background-position: -100px -529px;
    }

    .iconRecruit:after {
        background-position: -200px -529px;
    }

    .sectionBox1 {
        padding: 0 0 20px;
    }

    .sectionBox1 .heading {
        position: static;
        width: 130px;
        height: 130px;
        margin: 0 auto 20px;
    }

    .sectionBox1 h2 {
        width: 110px;
        height: 110px;
        left: 50%;
        margin: 0 0 0 -55px;
    }

    .sectionBox1 h3 {
        width: 110px;
        height: 110px;
        padding: 10px 5px 5px;
        font-size: 67%;
    }

    .sectionBox1 h3 .sub {
        font-size: 150%;
    }

    .sectionBox1 dl,.sectionBox1 p {
        display: block;
        height: auto;
        padding: 0;
        background-color: transparent;
    }

    .sectionBox1 dl dd {
        padding: 0;
    }

    .sectionBox2 {
        padding: 60px 0 10px;
    }

    .sectionBox2:before {
        top: 18px;
        left: 70px;
    }

    .tabNav li {
        font-size: 67%;
    }

    .tabNav li a {
        padding: 0 5px;
    }

    .imageList1 dl {
        float: none;
        width: auto;
        padding: 0 0 30px 105px;
        text-align: left;
    }

    .imageList1 dl:after {
        left: -15px;
        margin: 0;
    }

    .imageList1 dt {
        display: block;
        width: auto;
        height: auto;
        padding: 0 0 15px;
    }

    .imageList1 br {
        display: none;
    }

    .imageList1 em {
        display: inline-block;
        margin: 0 5px 0 0;
    }

    .contactList,.contactList li,.contentsBox .btnSubmit li,p.btnLarge {
        display: block;
    }

    .contactList li {
        width: auto;
        height: auto;
        padding: 25px 5% 10px;
        border: 0;
    }

    .contactList address {
        font-size: 90%;
    }

    .contactList .btnLarge {
        padding: 0 5% 25px;
        border-left: 0 none;
    }

    p.btnLarge {
        width: auto;
        height: auto;
        padding: 25px 5%;
    }

    .contentsBox table:not(.price),.contentsBox table:not(.price) tbody,.contentsBox table:not(.price) td,.contentsBox table:not(.price) th,.contentsBox table:not(.price) thead,.contentsBox table:not(.price) tr {
        display: block;
        width: auto;
    }

    .contentsBox table:not(.price) th {
        padding: 0 0 10px;
        font-weight: 700;
    }

    .contentsBox table:not(.price) td {
        padding: 0 0 20px;
    }

    .field1 {
        width: 100%;
    }

    .field3 {
        width: 50%;
    }

    .field1,.field2,.field3 {
        margin: 0 0 5px;
        padding: 2px 5px;
        font-size: 110%;
    }

    .contentsBox .btnSubmit input {
        width: 100%;
    }

    .social {
        height: 45px;
        padding: 0;
    }

    .contentsBox table.price td {
        padding: 10px 5px;
    }

    .contentsBox table.price tbody tr:first-of-type td,.contentsBox table.price th {
        padding: 15px 5px;
    }

    .contentsBox table.price em {
        font-size: 180% !important;
    }

    #pageTop {
        position: relative;
        margin: 0 auto 20px;
        top: auto;
        right: auto;
    }

    #footerAddress address br,#footerCopyright br {
        display: inline;
    }

    .topMainvisualArea a {
        height: auto;
    }

    .topMainvisualArea .imgArea,.topMainvisualArea .textArea {
        float: none;
        width: auto;
    }

    .topMainvisualArea .imgArea .img {
        height: 0;
        padding: 60.4166666% 0 0;
    }

    .topMainvisualArea .icon:after {
        height: 40px;
        -moz-background-size: 420px 940px;
        -webkit-background-size: 420px 940px;
        -o-background-size: 420px 940px;
        -ms-background-size: 420px 940px;
        background-size: 420px 940px;
    }

    .topMainvisualArea .textArea {
        height: 16em;
        padding-left: 5%;
        padding-right: 5%;
    }

    .topMainvisualArea .logo {
        height: 90px;
        padding: 0;
        overflow: hidden;
    }

    .topMainvisualArea .text {
        font-size: 83%;
    }

    .topMainvisualArea .btn,.topMainvisualArea .pagenation {
        width: 100%;
        bottom: 16em;
    }

    #contactBox {
        font-size: 160%;
    }

	#pageTitle .textArea .text {
		/*color:#000000;*/
	}
	#pageTitle {
		width:200px;
		min-width:200px;
	}
	#pageTitle .textArea {
		width:200px;
		min-width:200px;
	}
	#pageTitle .textArea .text {
		width:190px;
		min-width:190px;
	}
}

body {
	background-color:#ffffff;
}
/*------------------------------------  いのうえ ---------------------*/
/*#pattern {
    position: absolute;
    width: 100%;
    height: 150%;
    top: 0px;
    left: 0px;
    z-index: 10000;
    background-image: url(../img/header/pattern.png);
    background-repeat: repeat;
}*/