/*=============================================================
  common.css
---------------------------------------------------------------

01. common layout
02. header
03. footer
04. home
05. projects
06. theme
07. mobile
08. media query
09. helper

===============================================================
01. common layout
=============================================================*/

.preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    transition: none !important;
}

body {
    color: #000;
    font-size: 18px;
    letter-spacing: 1.5px;
    line-height: 1.5;
}

.pc {
	display: inline-block;
}

.sp {
	display: none;
}

.central {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    -webkit-transform: translateX( -50% ) translateY( -50% );
    -moz-transform: translateX( -50% ) translateY( -50% );
    -ms-transform: translateX( -50% ) translateY( -50% );
    transform: translateX( -50% ) translateY( -50% );
}

img {
    display: inline-block;
    width: 100%;
    overflow: hidden;
}

.link-text {
    color: #000;
}

.tit {
    margin-bottom: 30px;
}

.tit span {
    font-size: 18px;
    font-weight: normal;
}

.tit span.text-white {
    color: #fff;
    font-weight: bold;
}

.tit img {
    width: auto;
    height: 80px;
    margin-bottom: 5px;
}

.tit.two-parts {
    line-height: 1;
}

.tit.two-parts img {
    margin-bottom: 17px;
}

.tit.two-parts img:nth-of-type( 1 ) {
    margin-right: 40px;
}

.tit-text {
    font-size: 40px;
    font-weight: normal;
}

.tit-text-02 {
    font-size: 27px;
    font-weight: normal;
}

.tit-text-with-line {
    margin-bottom: 35px;
    font-size: 30px;
    font-weight: normal;
    line-height: 1.6;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

/*
.tit-text-with-line::after {
    display: inline-block;
    content: "";
    width: 120px;
    height: 1px;
    background: #000;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}
*/

.border-round-wrapper {
    line-height: 1.4;
}

.border-round-wrapper span.border-round {
    display: inline-block;
    padding: 3px 10px 3px 11px;
    border: solid 1px #000;
    -webkit-border-radius: 100px;
    border-radius: 100px;
    margin: 0 3px;
    font-size: 16px;
}

#contents {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

#contents .mass {
    padding: 100px 0;
}

#contents .white-base {
    transition: all ease 800ms;
    background: rgba( 255,255,255,0 );
}

#contents .active.white-base {
    background: rgba( 255,255,255,0.9 );
}

#contents .inner {
    width: 86%;
    margin: 0 auto;
}

#contents .inner p {
    margin-bottom: 20px;
}

#contents .inner p:last-of-type {
    margin-bottom: 0;
}

/*
 * mini-section
 */

.mini-section {
    margin-bottom: 30px;
}

.mini-section:last-of-type {
    margin-bottom: 0;
}

.mini-section > h1 {
    font-weight: normal;
}

/*
 * btn
 */

.btn-row {
    padding-top: 30px;
    text-align: center;
}

.btn-01 {
    display: inline-block;
    width: 100%;
    max-width: 480px;
    padding: 25px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: solid 3px rgba( 0,0,0,0.3 );
    -webkit-border-radius: 300px;
    border-radius: 300px;
    color: #000;
    text-decoration: none;
    line-height: 1;
    text-align: center;
    transition: all ease 400ms;
}

.btn-01:hover {
    border: solid 3px rgba( 0,0,0,0.99999 );
}

/*
 * basic motion
 */

.elem-01,
.elem-02,
.elem-03,
.elem-04,
.elem-05 {
    transition: all ease 800ms;
    transform: translateY( 20px );
    opacity: 0;
}

.elem-02 {
    transition-delay: 300ms;
}

.elem-03 {
    transition-delay: 600ms;
}

.elem-04 {
    transition-delay: 900ms;
}

.elem-05 {
    transition-delay: 1200ms;
}

.active .elem-01,
.active .elem-02,
.active .elem-03,
.active .elem-04,
.active .elem-05 {
    transform: translateY( 0 );
    opacity: 0.99999;
}

/*
 * #loading-layer
 */

#loading-layer {
    width: 100%;
    height: 100%;
    background: #000;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 40;
    transition-delay: 250ms;
    transition: all ease 850ms;
    overflow: hidden;
}

.loaded #loading-layer {
    opacity: 0;
    visibility: hidden;
}

/*
 * #bg and #video
 */

#bg {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
}

#video-wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
}

#video {
    min-width: 100%;
    min-height: 100%;
    background: #000;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    -webkit-transform: translateX( -50% ) translateY( -50% );
    -moz-transform: translateX( -50% ) translateY( -50% );
    -ms-transform: translateX( -50% ) translateY( -50% );
    transform: translateX( -50% ) translateY( -50% );
}

#video-wrapper .paused-layer {
    width: 100%;
    height: 100%;
    background: url( /common/video/poster-sp.jpg ) center center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#video-wrapper .paused-layer.none {
    display: none;
}


/*
 * .pages #bg
 */

.pages #bg div {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all linear 9000ms;
    transform: scale( 1.5 );
    overflow: hidden;
}

.pages.loaded #bg div {
    transform: scale( 1.00001 );
}

.pages #box-tit-set {
}

.pages #box-sub-tit-alt {
    margin-bottom: 20px;
}

.pages #box-sub-tit-alt img {
    width: auto;
    height: 130px;
    opacity: 0;
}

.pages #box-sub-tit-alt img.sub-tit-parts {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all ease 800ms;
    transform: translateY( 15px );
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts {
    opacity: 0.99999;
    transform: translateY( 0 );
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 1 ) {
    transition-delay: 600ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 2 ) {
    transition-delay: 700ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 3 ) {
    transition-delay: 800ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 4 ) {
    transition-delay: 900ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 5 ) {
    transition-delay: 1000ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 6 ) {
    transition-delay: 1100ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 7 ) {
    transition-delay: 1200ms;
}

.pages.loaded #box-sub-tit-alt img.sub-tit-parts:nth-of-type( 8 ) {
    transition-delay: 1300ms;
}

.pages #sub-tit-all {
    vertical-align: top;
    opacity: 0;
    transition: all ease 2000ms;
    transition-delay: 3000ms;
}

.pages.loaded #sub-tit-all {
    opacity: 0.99999;
}

.pages #visual #box-main-tit,
.pages #visual #icon-scroll-set {
    transition: all ease 800ms;
    opacity: 0;
}

.pages #visual #box-main-tit {
    transition-delay: 1200ms;
}

.pages #visual #icon-scroll-set {
    transition-delay: 1600ms;
}

.pages.loaded #visual #box-main-tit,
.pages.loaded #visual #icon-scroll-set {
    opacity: 0.99999;
}

.pages.loaded.init-motion-end #box-sub-tit-alt img.sub-tit-parts,
.pages.loaded.init-motion-end #sub-tit-all,
.pages.loaded.init-motion-end-alt #bg div {
    transition: none;
}

/*
 * #visial
 */

#visual {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
}

#visual #box-main-tit {
    text-align: center;
}

#visual #box-main-tit img,
#visual #box-main-tit span {
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: rgba( 0,24,51,0.7 );
}

#visual #box-main-tit img {
    padding: 26px;
}

#visual #box-main-tit span {
    padding: 16px 26px;
    color: #fff;
    font-size: 22px;
    font-weight: normal;
    white-space: nowrap;
}

#visual #icon-scroll-set {
    display: inline-block;
    width: 70px;
    position: absolute;
    bottom: 40px;
    left: 50%;
    z-index: 1;
    -webkit-transform: translateX( -50% );
    -moz-transform: translateX( -50% );
    -ms-transform: translateX( -50% );
    transform: translateX( -50% );
    text-align: center;
}

#visual #icon-scroll-set p {
    line-height: 1;
}

#visual #icon-scroll-set #scroll-bar {
    display: inline-block;
    width: 1px;
    height: 140px;
    background: rgba( 255,255,255,0.25 );
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
}

#visual #icon-scroll-set #scroll-bar img {
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    animation: scroll-bar-motion linear infinite 3000ms;
}

@keyframes scroll-bar-motion {
    0%{ top: -100%; }
    50%{ top: 100%; }
    100%{ top: 100%; }
}

/*
 * .list-with-circle
 */

.list-with-circle li {
    display: inline-block;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 1em;
    text-indent: -0.7em;
}

.list-with-circle li::before {
    display: inline-block;
    content: "\025c7";
    margin-right: 0.3em;
    transform: scale( 0.7 );
}

/*
 * .list-with-line
 */

.list-with-line li {
    display: block;
    border-bottom: solid 1px rgba( 0,0,0,0.1 );
    padding: 15px 0;
    overflow: hidden;
}

.list-with-line li:nth-of-type( 1 ) {
    border-top: solid 1px rgba( 0,0,0,0.1 );
}

.list-with-line li h1 {
    font-weight: normal;
    margin-left: 8.5em;
}

.list-with-line li p {
    width: 8.5em;
    float: left;
    font-size: 18px;
    opacity: 0.6;
}

/*
 * .box-text
 */

.box-text {
    padding: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: rgba( 255,255,255,0.9 );
}

.box-text.white-100op {
    background: #fff;
}

/*
 * .box-img
 */

.box-img {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
}

.box-img div {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transform: scale( 1.4 );
    overflow: hidden;
}

.active .box-img div:nth-of-type( 1 ) {
    animation: img-color linear forwards 7000ms;
}

@keyframes img-color {
    0%{ transform: scale( 1.4 );  }
    50%{ transform: scale( 1.2 ); }
    100%{ transform: scale( 1.0001 ); }
}

.active .box-img div:nth-of-type( 2 ) {
    animation: img-mono linear forwards 7000ms;
}

@keyframes img-mono {
    0%{ transform: scale( 1.4 ); opacity: 1; }
    50%{ transform: scale( 1.2 ); opacity: 1; }
    100%{ transform: scale( 1.0001 ); opacity: 0; }
}

/*
 * .row
 */

.row {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

/*
 * .basic-box
 */

.basic-box {
    overflow: hidden;
}

.basic-box .box-img {
    width: 100%;
    padding-top: 50%;
}

/*
 * .divi
 */

.divi {
    overflow: hidden;
}

.divi .box-img {
    width: 55%;
    height: 80%;
    position: absolute;
    top: 10%;
    left: -9%;
    z-index: 1;
}

.divi .box-text {
    width: 48%;
    margin-left: 52%;
}

/*
 * .divi-img-right
 */

.divi-img-right .box-img {
    width: 48%;
    height: 80%;
    position: absolute;
    top: 10%;
    left: auto;
    right: 0;
    z-index: 1;
}

.divi-img-right .box-text {
    width: 48%;
    margin-left: 0;
}

/*
 * .neatly
 */

#contents .neatly {
    padding-top: 20px;
}
#contents .neatly .inner {
    width: 100%;
}

.neatly .row {
    overflow: hidden;
}

.neatly .box-img,
.neatly .box-text {
    width: 50%;
}

.neatly .box-img {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.neatly .box-text {
    margin-left: 50%;
}

/*
 * .double-img
 */

.double-img {
    overflow: hidden;
}

.double-img .row {
    margin-bottom: 5%;
}

.double-img .box-img:nth-of-type( 1 ) {
    width: 55%;
    height: 80%;
    position: absolute;
    top: 10%;
    left: -9%;
    z-index: 1;
}

.double-img .box-img:nth-of-type( 2 ) {
    width: 57%;
    padding-top: 40%;
    margin-left: 52%;
}

.mb-20 {
	margin-bottom: 20px;
}

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

.a-block {
	display: block;
}

/*=============================================================
02. header
=============================================================*/

#main-header {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

#main-header > h1 {
    width: 340px;
    position: relative;
    top: 20px;
    left: 20px;
    z-index: 1;
}

#main-header > h1 > a {
    display: inline-block;
}

#main-header #icon-nav {
    width: 80px;
    height: 80px;
    background: rgba( 0,24,51,0.7 );
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1;
    cursor: pointer;
    transition: all ease 300ms;
    overflow: hidden;
}

#main-header #icon-nav:hover {
    background: rgba( 0,24,51,1 );
}

#main-header #icon-nav span {
    display: inline-block;
    width: 30px;
    height: 1px;
    background: #fff;
    position: absolute;
    left: 25px;
    z-index: 1;
    overflow: hidden;
}


#main-header #icon-nav:hover span {
    animation: nav-icon-bar ease forwards 1000ms;
}

#main-header #icon-nav span:nth-of-type( 1 ) {
    top: 34px;
}

#main-header #icon-nav span:nth-of-type( 2 ) {
    top: 44px;
}

#main-header #icon-nav:hover span:nth-of-type( 2 ) {
    animation-delay: 150ms;
}

@keyframes nav-icon-bar {
    0%{ opacity: 1; left: 25px; }
    35%{ opacity: 0; left: 0; }
    65%{ opacity: 0; left: 80px; }
    100%{ opacity: 1; left: 25px; }
}

/*
* global nav
*/

#main-header #nav-wrapper,
#main-header #nav-bg,
#main-header #close-layer {
    width: 100%;
    height: 100%;
}

#main-header #nav-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
}

#main-header #nav-bg,
#main-header #close-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#main-header #nav-bg {
    background-image: url( /common/img/shared/nav-bg.jpg?v1 );
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

#main-header #icon-close {
    width: 60px;
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
    cursor: pointer;
}

#main-header #icon-close #cross {
    width: 100%;
    height: 50px;
}

#main-header #icon-close #cross::before,
#main-header #icon-close #cross::after {
    display: inline-block;
    content: "";
    width: 30px;
    height: 1px;
    background: #fff;
    position: absolute;
    top: 25px;
    left: 15px;
    z-index: 1;
}

#main-header #icon-close #cross::before {
    transform: rotate( 45deg );
}

#main-header #icon-close #cross::after {
    transform: rotate( 135deg );
}

#main-header #icon-close p {
    line-height: 1;
    text-align: center;
}

#main-header #icon-close p img {
    width: 40px;
    vertical-align: top;
}

#main-header .central {
    width: 70%;
    max-width: 1240px;
}

#main-header .central nav {
    margin-bottom: 15%;
}

#main-header .central #nav-box {
    width: 21%;
    padding-bottom: 5%;
}

#main-header .central nav ul li {
    display: inline-block;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    line-height: 1.2;
}

.nav-open #main-header .central nav ul li::before,
.nav-open #main-header .central nav ul li::after {
    animation: nav-bar ease forwards 1000ms;
    animation-delay: 1000ms;
}

@keyframes nav-bar {
    0%{ opacity: 0.5; width: 0; right: 0%; }
    50%{ opacity: 0.5; width: 100%; right: 0%; }
    100%{ opacity: 0.99999; width: 20%; right: 80%; }
}

#main-header .central nav ul li::before,
#main-header .central nav ul li::after {
    display: inline-block;
    content: "";
    width: 0;
    height: 1px;
    background: rgba( 255,255,255,0.7 );
    position: absolute;
    right: 0;
    z-index: 1;
}

#main-header .central nav ul li::before {
    bottom: 3px;
}

#main-header .central nav ul li::after {
    bottom: 0;
}

#main-header .central nav ul li a {
    display: inline-block;
    padding: 13% 0 13.3%;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
}

#main-header .central ul li a img,
#main-header .central ul li a span {
    transition: all ease 250ms;
    opacity: 0.75;
}

#main-header .central ul li a:hover img,
#main-header .central ul li a:hover span {
    transform: translateX( 10px );
    opacity: 0.99999;
}

#main-header .central ul#sns-list a:hover img {
    transform: translateX( 0 );
}

#main-header .central nav ul li a img {
    padding: 1% 0 5%;
}

#main-header .central nav ul li a span {
    display: inline-block;
    font-size: 16px;
}

#main-header .central #nav-img {
    width: 68%;
    height: 100%;
    background-image: url( /common/img/shared/nav-img.jpg?v1 );
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}

#main-header .central aside ul#sns-list {
    white-space: nowrap;
}

#main-header .central aside ul#sns-list li {
    display: inline-block;
    margin-left: 7px;
}

#main-header .central aside ul#sns-list li:nth-of-type( 1 ) {
    margin-left: 0;
}

#main-header .central aside ul#sns-list li:nth-of-type( 2 ) {
    margin-left: 5px;
}

#main-header .central aside ul#sns-list a img {
    width: auto;
    height: 32px;
    padding: 0;
}

/*
* nav motion
*/

#main-header #nav-wrapper {
    transition: all ease 600ms;
}

.nav-open #main-header #nav-wrapper {
    visibility: visible;
    opacity: 1;
}

#main-header #nav-bg {
    transition: all ease 700ms;
    transform: scale( 1.2 );
}

.nav-open #main-header #nav-bg {
    transform: scale( 1.00001 );
}

#main-header #main-nav-row ul li {
    transition: all ease 500ms;
    opacity: 0;
    transform: translateX( 20px );
}

.nav-open #main-header #main-nav-row ul li {
    transform: translateX( 0 );
    opacity: 0.99999;
}

.nav-open #main-header #main-nav-row ul li:nth-of-type( 1 ) {
    transition-delay: 600ms;
}

.nav-open #main-header #main-nav-row ul li:nth-of-type( 2 ) {
    transition-delay: 700ms;
}

.nav-open #main-header #main-nav-row ul li:nth-of-type( 3 ) {
    transition-delay: 800ms;
}

.nav-open #main-header #main-nav-row ul li:nth-of-type( 4 ) {
    transition-delay: 900ms;
}

#main-header #main-nav-row {
    padding: 30px 0;
    -webkit-perspective: 1000px;
    perspective: 1000px;
    
}

#main-header #main-nav-row #nav-img {
    transition: all ease 1000ms;
    transform: rotateY( 12deg );
    opacity: 0;
}

.nav-open #main-header #main-nav-row #nav-img {
    transform: rotateY( -12deg );
    opacity: 0.99999;
    transition-delay: 600ms;
}


/*=============================================================
03. footer
=============================================================*/

#main-footer {
    padding: 100px 0;
    background: rgba( 0,24,51,0.2 );
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

#main-footer p {
    text-align: center;
    line-height: 1;
}

#main-footer p img {
    width: 480px;
    vertical-align: central;
}

/*=============================================================
04. home
=============================================================*/

#home #main-header h1 {
    display: none;
}

#home #bg span.layer-adjust-loaded,
#home #bg span.layer-adjust-scroll {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#home #bg span.layer-adjust-loaded {
    background: rgba( 0,0,0,0.7 );
    transition: all ease 800ms;
    transition-delay: 4000ms;
}

#home.loaded #bg span.layer-adjust-loaded {
    background: rgba( 0,0,0,0.0 );
}

#home #bg span.layer-adjust-scroll {
    background: rgba( 0,0,0,0.3 );
}

#home #visual #box-tit-set {
    width: 86%;
    max-width: 1500px;
}

#home #visual #box-sub-tit {
    margin-bottom: 20px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

#home #visual #box-sub-tit img {
    opacity: 0;
}

#home #visual #box-sub-tit img#sub-tit-all {
    vertical-align: top;
    transition: all ease 5000ms;
    transition-delay: 4500ms;
}

#home.loaded #visual #box-sub-tit img#sub-tit-all {
    opacity: 0.99999;
}

#home #visual #box-sub-tit .sub-tit-parts {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all ease 2700ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts {
    opacity: 0.99999;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 1 ) {
    transition-delay: 1000ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 2 ) {
    transition-delay: 2200ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 3 ) {
    transition-delay: 1450ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 4 ) {
    transition-delay: 1750ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 5 ) {
    transition-delay: 2350ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 6 ) {
    transition-delay: 1150ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 7 ) {
    transition-delay: 1600ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 8 ) {
    transition-delay: 1300ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 9 ) {
    transition-delay: 2050ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 10 ) {
    transition-delay: 2500ms;
}

#home.loaded #visual #box-sub-tit .sub-tit-parts:nth-of-type( 11 ) {
    transition-delay: 1900ms;
}

#home #visual #box-sub-tit .sub-tit-all {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all linear 3000ms;
}

#home #visual #box-main-tit {
    text-align: center;
    transition: all ease 1700ms;
    transition-delay: 4200ms;
    opacity: 0;
}

#home.loaded #visual #box-main-tit {
    opacity: 0.99999;
}

#home #visual #box-main-tit img {
    width: 340px;
}

#home #visual #icon-scroll-set {
    transition: all ease 1200ms;
    transition-delay: 4200ms;
    opacity: 0;
}

#home.loaded #visual #icon-scroll-set {
    opacity: 0.99999;
}

#home #part-01 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-01.jpg?v4 );
}

#home #part-01 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-01-mono.jpg?v4 );
}

#home #part-02 .box-img:nth-of-type( 1 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-02.jpg?v2 );
}

#home #part-02 .box-img:nth-of-type( 1 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-02-mono.jpg?v2 );
}

#home #part-02 .box-img:nth-of-type( 2 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-03.jpg?v2 );
}

#home #part-02 .box-img:nth-of-type( 2 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-03-mono.jpg?v2 );
}

#home #part-02 .elem-04 {
    width: 43em;
    margin: 0 auto;
}

#home #part-02 .elem-04 ul li {
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: solid 1px rgba( 0,0,0,0.1 );
}

#home #part-03 {
    padding-bottom: 10px;
}

#home #part-03 .box-text {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}

#home #part-03 .box-img:nth-of-type( 1 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-04.jpg?v2 );
}

#home #part-03 .box-img:nth-of-type( 1 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-04-mono.jpg?v2 );
}

#home #part-03 .box-img:nth-of-type( 2 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-05.jpg?v3 );
}

#home #part-03 .box-img:nth-of-type( 2 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-05-mono.jpg?v3 );
}

#home #part-04 .section-mini {
    padding-bottom: 15px;
    border-bottom: solid 1px rgba( 0,0,0,0.1 );
    margin-bottom: 15px;
}

#home #part-04 .section-mini:last-of-type {
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: 0;
}

#home #part-04 .section-mini > h1 {
    font-weight: normal;
    font-size: 24px;
}

#home #part-04 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-06.jpg?v4 );
}

#home #part-04 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-06-mono.jpg?v4 );
}

#home #part-04 .section-mini:nth-of-type(5) ul li:nth-of-type(2)::before {
	content: ""
}

#home #part-04 li img {
	width: 20%;
}

#home #part-05 {
    padding-bottom: 0;
}

#home #part-05 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/home/img-07.jpg?v4 );
}

#home #part-05 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/home/img-07-mono.jpg?v4 );
}

#home #part-05 .box-text {
    padding-top: 70px;
    padding-bottom: 60px;
}

#home #part-05 .box-text .tit {
    margin-bottom: 15px;
}

#home #part-05 h2 {
    padding-top: 15px;
    border-top: solid 1px rgba( 0,0,0,0.1 );
    margin-bottom: 5px;
}

#home #part-05 h2.mb-plus {
    margin-bottom: 12px;
}

#home #part-05 h2 span {
    display: inline-block;
    margin-left: 15px;
    font-size: 16px;
}

#home #part-05 p.mb-plus {
    margin-bottom: 7px;
}

#home #part-05 dl {
    line-height: 1.6;
    margin-bottom: 20px;
}

#home #part-05 dl.no-mb {
    margin-bottom: 0;
}

#home #part-05 dl dt,
#home #part-05 dl dd {
    padding: 7px 0;
}

#home #part-05 dl dt {
    width: 5.7em;
    float: left;
    clear: both;
}

#home #part-05 dl dd {
    margin-left: 5.7em;
}

#home #part-05 dl dd ul li {
    display: inline-block;
    margin-right: 3px;
}

#home #part-05 dl dd ul li:nth-of-type( 2 ) {
    margin-right: 6px;
}

#home #part-05 dl dd ul li:last-of-type {
    margin-right: 0;
}

#home #part-05 dl dd ul li img {
    width: auto;
    height: 25px;
}

#home #part-05 dl dd.line-btn {
    padding-top: 1px;
}

#home #part-05 dl dd.line-btn img {
    width: auto;
}

#home #part-05 dl .line-btn img {
    width: auto;
}

/*=============================================================
05. projects
=============================================================*/

#projects #bg div {
    background-image: url( /common/img/projects/bg.jpg?v1 );
}

#projects .mini-section > h1 {
    margin-bottom: 16px;
    font-style: italic;
    font-size: 27px;
}

#projects #part-01,
#projects #part-02,
#projects #part-03 {
    padding-bottom: 0;
}

#projects #part-01 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-01.jpg?v5 );
}

#projects #part-01 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-01-mono.jpg?v5 );
}

#projects #part-02 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-02.jpg?v3 );
}

#projects #part-02 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-02-mono.jpg?v3 );
}

#projects #part-03 .box-img:nth-of-type( 1 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-03.jpg?v3 );
}

#projects #part-03 .box-img:nth-of-type( 1 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-03-mono.jpg?v3 );
}

#projects #part-03 .box-img:nth-of-type( 2 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-04.jpg?v4 );
}

#projects #part-03 .box-img:nth-of-type( 2 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-04-mono.jpg?v4 );
}

#projects #part-04 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-05.jpg?v4 );
}

#projects #part-04 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-05-mono.jpg?v4 );
}

#projects .article-img {
	text-align: center;
	margin-top: 20px;
}

#projects .article-img img {
	width: 80%;
}

#projects #part-05.double-img .row {
    margin-bottom: 3%;
}

#projects #part-05 .mini-section > h1 {
    color: #ac9845;
}

#projects #part-05 .box-img:nth-of-type( 1 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-06.jpg?v4 );
}

#projects #part-05 .box-img:nth-of-type( 1 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-06-mono.jpg?v4 );
}

#projects #part-05 .box-img:nth-of-type( 2 ) div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-07.jpg?v5 );
}

#projects #part-05 .box-img:nth-of-type( 2 ) div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-07-mono.jpg?v5 );
}

#projects #part-06 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-08.jpg?v4 );
}

#projects #part-06 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-08-mono.jpg?v4 );
}

#projects #part-07 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/projects/img-09.jpg?v4 );
}

#projects #part-07 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/projects/img-09-mono.jpg?v4 );
}

#projects #part-07 {
    padding-bottom: 0;
}

#projects #part-07 .tit {
    margin-bottom: 20px;
}

/*=============================================================
06. theme
=============================================================*/

#theme #bg div {
    background-image: url( /common/img/theme/bg.jpg?v1 );
}

#theme #bg div::after {
    display: inline-block;
    content: "";
    width: 100%;
    height: 100%;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 60%, rgba(0,0,0,0.4) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 60%,rgba(0,0,0,0.4) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 60%,rgba(0,0,0,0.4) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#theme #main-footer {
    background: rgba( 0,24,51,0.5 );
}

#theme #contents .mass {
    padding-top: 0;
}

#theme .mini-section h1 {
    padding-left: 10px;
    border-left: solid 4px #bbb;
    margin-bottom: 10px;
    font-size: 30px;
    line-height: 1.2;
}

#theme #contents .with-geometry {
    margin-bottom: 17px;
}

#theme .with-geometry span.tit-ml {
    display: inline-block;
    margin-left: 64px;
}

#theme .with-geometry span.box-geometry {
    display: inline-block;
    position: absolute;
    top: -3px;
    left: 0;
    z-index: 1;
}

#theme .with-geometry span.box-geometry img {
    width: auto;
    height: 49px;
    animation: rotate-geometry linear infinite 12000ms;
}

@keyframes rotate-geometry {
    0%{ transform: rotate( 0 ); }
    100%{ transform: rotate( 360deg ); }
}

#theme .with-geometry > img {
    width: auto;
    height: 40px;
    vertical-align: sub;
}

#theme .icon-clock {
    display: inline-block;
    width: 25px;
    margin-right: 10px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    vertical-align: top;
}

#theme .icon-clock img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all ease 2000ms;
}

#theme .mini-section.active .icon-clock img:nth-of-type( 1 ) {
    transform: rotate( 315deg );
}

#theme .mini-section.active .icon-clock.max-90min img:nth-of-type( 2 ) {
    transform: rotate( 45deg );
}

#theme .mini-section.active .icon-clock.max-90min img:nth-of-type( 3 ) {
    transform: rotate( 540deg );
}

#theme .mini-section.active .icon-clock.max-120min img:nth-of-type( 2 ) {
    transform: rotate( 60deg );
}

#theme .mini-section.active .icon-clock.max-120min img:nth-of-type( 3 ) {
    transform: rotate( 720deg );
}

#theme #part-0 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-0.jpg?v1 );
}

#theme #part-0 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-0-mono.jpg?v1 );
}

#theme #part-01 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-01.jpg?v3 );
}

#theme #part-01 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-01-mono.jpg?v3 );
}

#theme #part-02 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-02.jpg?v2 );
}

#theme #part-02 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-02-mono.jpg?v2 );
}

#theme #part-03 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-03.jpg?v2 );
}

#theme #part-03 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-03-mono.jpg?v2 );
}

#theme #part-04 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-04.jpg?v2 );
}

#theme #part-04 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-04-mono.jpg?v2 );
}

#theme #part-05 .box-img div:nth-of-type( 1 ) {
    background-image: url( /common/img/theme/img-05.jpg?v2 );
}

#theme #part-05 .box-img div:nth-of-type( 2 ) {
    background-image: url( /common/img/theme/img-05-mono.jpg?v2 );
}

/*=============================================================
07. mobile
=============================================================*/

.mobile .btn-01:hover {
    border: solid 3px rgba( 0,0,0,0.3 );
}

.mobile #main-header .central ul li a img,
.mobile #main-header .central ul li a span,
.mobile #main-header .central ul li a:hover img,
.mobile #main-header .central ul li a:hover span {
    transform: translateX( 0 );
    opacity: 1;
}

/*=============================================================
08. media query
=============================================================*/

@media screen and (max-width: 1700px) {

    .tit img {
        height: 60px;
    }

}

@media screen and (max-width: 1280px) {

    #visual #box-main-tit span {
        font-size: 20px;
    }

    .pages #box-sub-tit-alt img {
        height: 120px;
    }

}

@media screen and (max-width: 1200px) {

    body,
    .list-with-line li p {
        font-size: 16px;
    }

    .tit img {
        height: 50px;
    }

    .divi .box-text {
        width: 57%;
    }

    #visual #box-main-tit span {
        font-size: 16px;
    }

    .pages #box-sub-tit-alt img {
        height: 94px;
    }

    #main-header .central {
        width: 76%;
    }

    #theme .icon-clock {
        top: -1px;
    }

    #theme .with-geometry span.box-geometry img {
        height: 45px;
    }

    #theme .with-geometry span.tit-ml {
        margin-left: 58px;
    }

}

@media screen and (max-width: 1024px) {

    #main-footer p img {
        width: 400px;
    }

    #theme #contents .with-geometry {
        margin-bottom: 14px;
    }

    #theme .with-geometry > img {
        height: 30px;
    }

    #theme .with-geometry span.box-geometry img {
        height: 43px;
    }

    #theme .with-geometry span.tit-ml {
        margin-left: 57px;
    }

    .tit-text-with-line {
        margin-bottom: 30px;
        font-size: 26px;
    }

    #theme .mini-section h1 {
        font-size: 26px;
    }
	
	#home #part-04 li img {
	width: 25%;
}

}

@media screen and (max-width: 900px) {

	.pc {
		display: none;
    }

	.sp {
		display: inline-block;
    }

    #main-header .central {
        width: 58%;
    }

    #main-header .central nav ul li a {
        padding: 30px 0;
    }

    #main-header .central nav ul li a img {
        padding: 0 0 10px 0;
    }

    #main-header .central #nav-img {
        width: 100%;
        margin-bottom: 12px;
        padding-top: 68%;
        position: relative;
        top: 0;
        left: 0;
        z-index: 1;
    }

    .nav-open #main-header #main-nav-row #nav-img {
        transform: rotateY( 0 );
    }

    #main-header .central #nav-box {
        width: 100%;
        padding-bottom: 0;
    }

    #main-header .central nav {
        margin-bottom: 30px;
    }

    #main-header .central nav ul li a img {
        padding-right: 40%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    #main-header .central nav ul li a span {
        font-size: 14px;
    }

    .nav-open #main-header .central nav ul li::before,
    .nav-open #main-header .central nav ul li::after {
        animation: nav-bar-sp ease forwards 1000ms;
        animation-delay: 1000ms;
    }

    @keyframes nav-bar-sp {
        0%{ width: 0; opacity: 0; }
        100%{ width: 100%; opacity: 0.99999; }
    }

    #main-footer {
        padding: 80px 0;
    }

    #contents .mass {
        padding: 80px 0;
    }

    .divi .box-img,
    .divi .box-text {
        width: 100%;
    }

    .divi .box-img {
        padding-top: 80%;
        position: relative;
        top: 0;
        left: 0;
    }

    .divi .box-text {
        margin-left: 0;
    }

    .divi-img-right .box-img,
    .divi-img-right .box-text {
        width: 100%;
    }

    .divi-img-right .box-img {
        padding-top: 80%;
        position: relative;
        top: 0;
        left: 0;
        z-index: 1;
    }

    .neatly .box-img,
    .neatly .box-text {
        width: 100%;
    }

    .neatly .box-img {
        padding-top: 80%;
        position: relative;
    }

    #contents .neatly {
        padding-top: 0;
    }

    .neatly .box-text {
        margin-left: 0;
    }

    .double-img .row {
        margin-bottom: 6%;
    }

    .double-img .box-img:nth-of-type( 2 ) {
        padding-top: 60%;
    }

    #home #part-02 .elem-04 {
        width: 100%;
    }

}

@media screen and (max-width: 760px) {

    .pages #box-sub-tit-alt {
        margin-bottom: 15px;
    }

    .pages #box-sub-tit-alt img {
        height: 46px;
    }

    #visual #box-main-tit span {
        padding: 10px 17px;
        font-size: 14px;
    }

}

@media screen and (max-width: 700px) {

    body,
    .list-with-line li p {
        font-size: 15px;
    }

    #main-header > h1 {
        width: 250px;
        top: 25px;
        left: 18px;
    }

    #main-header #icon-nav {
        width: 70px;
        height: 70px;
    }

    #main-header #icon-nav span {
        width: 20px;
    }

    #main-header #icon-nav span:nth-of-type( 1 ) {
        top: 30px;
    }

    #main-header #icon-nav span:nth-of-type( 2 ) {
        top: 39px;
    }

    #main-header #nav-bg {
        background-position: left center;
    }

    #main-header .central {
        width: 66%;
        top: 51%;
    }

    #main-header .central nav {
        margin-bottom: 20px;
    }

    #main-header .central #nav-img {
        margin-bottom: 7px;
    }

    #main-header .central nav ul li a {
        padding: 20px 0;
    }

    #main-header .central nav ul li a img {
        padding-bottom: 5px;
    }

    #main-header #icon-close {
        right: 4px;
        top: 9px;
    }

    #main-header #icon-close #cross {
        height: 44px;
    }

    #main-header #icon-close #cross::before,
    #main-header #icon-close #cross::after {
        width: 24px;
        left: 18px;
    }

    #main-header #icon-close p img {
        width: 34px;
    }

    #main-footer {
        padding: 52px 0;
    }

    #main-footer p img {
        width: 93%;
        vertical-align: baseline;
    }

    .tit {
        margin-bottom: 37px;
        line-height: 1;
    }

    .tit span {
        font-size: 15px;
    }

    .tit img {
        height: 28px;
        margin-bottom: 8px;
    }

    .tit-text {
        font-size: 24px;
    }

    .list-with-line li p {
        width: 100%;
        float: none;
    }

    .list-with-line li h1 {
        margin-left: 0;
    }


    .tit.two-parts {
        line-height: 1;
    }

    .tit.two-parts img {
        margin-bottom: 10px;
    }

    .tit.two-parts img:nth-of-type( 1 ) {
        margin-right: 25px;
    }

    #contents .mass {
        padding: 42px 0 57px;
    }

    #contents .inner p {
        margin-bottom: 12px;
    }

    .btn-row {
        padding-top: 15px;
    }

    #visual #icon-scroll-set {
        width: 60px;
        bottom: 30px;
    }

    #visual #icon-scroll-set #scroll-bar {
        height: 100px;
    }

    .box-text {
        padding: 30px;
    }

    .basic-box .box-img {
        padding-top: 100%;
    }

    .divi .box-img {
        padding-top: 130%;
    }

    .divi-img-right .box-img {
        padding-top: 100%;
    }

    .double-img .row {
        margin-bottom: 0;
    }

    .double-img.white-base .row {
        margin-bottom: 30px;
    }

    .double-img .box-img:nth-of-type( 1 ),
    .double-img .box-img:nth-of-type( 2 ) {
        width: 100%;
        padding-top: 65%;
        position: relative;
        top: 0;
        left: 0;
    }

    .double-img .box-img:nth-of-type( 2 ) {
        margin-left: 0;
    }

    #contents .neatly {
        padding-top: 0;
    }

    .neatly .box-img {
        padding-top: 100%;
    }

    #home #visual #box-sub-tit {
        margin-bottom: 10px;
    }

    #home #visual #box-tit-set {
        width: 93%;
    }

    #home #visual #box-main-tit img {
        width: 78%;
        max-width: 300px;
        padding: 18px;
    }

    #home #part-02 {
        padding-bottom: 40px;
    }

    #home #part-02 .elem-04 ul {
        margin-bottom: 15px;
    }

    #home #part-04 .list-with-circle li {
        margin-bottom: 12px;
    }

    #home #part-04 .section-mini:nth-of-type(5) ul li:nth-of-type(2) {
        margin-bottom: 0;
		display: block;
		text-align: center;
		padding-left: 0;
    }

    #home #part-04 .section-mini > h1 {
        font-size: 22px;
    }

	#home #part-04 li img {
		width: 50%;
	}
	
    #home #part-05 .box-text {
        padding-top: 45px;
        padding-bottom: 45px;
    }

    #home #part-05 .box-text .tit {
        margin-bottom: 30px;
    }

    #home #part-05 h2 {
        padding-top: 25px;
        margin-bottom: 5px;
        line-height: 1.6;
        font-size: 22px;
    }

    #home #part-05 dl dd ul li img {
        height: 23px;
    }

    #projects #bg div {
        background-image: url( /common/img/projects/bg-sp.jpg?v1 );
    }

    #projects .mini-section > h1 {
        font-size: 20px;
        line-height: 1.6;
        margin-bottom: 10px;
    }

    #projects #part-03 .box-img:nth-of-type( 1 ) {
        display: none;
    }

    #projects #part-03 .box-img:nth-of-type( 2 ) {
        padding-top: 100%;
    }

    #projects #part-05 {
        padding-bottom: 45px;
    }

    #projects #part-05.double-img .row {
        margin-bottom: 30px;
    }

    #projects #part-07 .tit {
        padding-top: 5px;
    }
	
	#projects .article-img img {
	width: 100%;
	}

	
    #theme #contents .with-geometry {
        margin-bottom: 12px;
    }

    #theme .with-geometry > img {
        height: 28px;
    }

    #theme .with-geometry span img {
        height: 42px;
    }

    #theme .mini-section h1 {
        padding-left: 7px;
        font-size: 20px;
    }

    #theme .icon-clock {
        width: 22px;
    }

    #theme #part-05 .box-img div {
        background-position: left center;
    }

    .border-round-wrapper span.border-round {
        font-size: 15px;
    }

    .tit-text-with-line {
        font-size: 20px;
    }

    #theme .with-geometry span.box-geometry {
        top: -2px;
    }

    #theme .with-geometry span.box-geometry img {
        height: 34px;
    }

    #theme .with-geometry span.tit-ml {
        margin-left: 43px;
        line-height: 1.5;
    }

}

@media screen and (max-width: 500px) {

    #theme #contents .with-geometry {
        margin-bottom: 11px;
        line-height: 1.5;
    }

    #theme .with-geometry span.box-geometry {
        top: -1px;
        line-height: 1.5;
    }

    #theme .with-geometry span.box-geometry img {
        height: 28px;
    }

    #theme .with-geometry span.tit-ml {
        margin-left: 32px;
    }

    #theme .icon-clock {
        width: 22px;
    }

    #theme .box-text {
        padding: 25px;
    }

    .border-round-wrapper span.border-round {
        font-size: 15px;
    }

}

@media screen and (max-height: 500px) {

    #visual #icon-scroll-set {
        bottom: 20px;
    }

    #visual #icon-scroll-set #scroll-bar {
        height: 30px;
    }

}

@media screen and (max-width: 359px) {

    .pages #box-sub-tit-alt img {
        height: 38px;
    }

    #main-header > h1 {
        width: 210px;
        top: 25px;
        left: 15px;
    }

    #main-header #icon-close {
        transform: scale( 0.85 );
    }

    #main-header .central #nav-img {
        padding-top: 60%;
        margin-bottom: 3px;
    }

    #main-header .central nav {
        margin-bottom: 13px;
    }

    #main-header .central nav ul li a {
        padding: 13px 0;
    }

    #main-header .central aside ul#sns-list a img {
        height: 30px;
    }

    #theme .with-geometry span {
        margin-right: 1px;
    }

    #theme .with-geometry > img {
        height: 21px;
    }
	
	#home #part-04 li img {
		width: 80%;
	}
	
    .tit-text-with-line::after {
        width: 70px;
    }

    .border-round-wrapper span.border-round {
        padding: 3px 5px 3px 6px;
        margin: 0 2px;
        font-size: 13px;
        letter-spacing: 1px;
    }

}

/*=============================================================
09. helper
=============================================================*/

.ta-c {
    text-align: center;
}

.clr {
	clear: both;
}

/*
* clear fix
*/

.cf:before,
.cf:after {
	content:"";
	display: block;
	height: 0;
	overflow: hidden;
}

.cf:after {
	clear: both;
}