/*
 Theme Name: tdo_inc child
 Template: tdo_inc
*/


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

@import "css/reset.css";
@import "css/header.css";
@import "css/footer.css";

/* ---------- COMMON ---------- */

body {
    color: #323232;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5em;
}
.post, .page{
    margin-bottom: 0 !important;
}

/* link */
a{
    text-decoration: none;
}

img {
    max-width: 100%;
}

button{
    margin: 0;
    padding:0;
}

.no_header article a{
    color: #0076be;
}

.no_header h1{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Swiper本体のJSをいじらずに、CSSでフェード時の「残像」を消す */
.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
  opacity: 0 !important; /* 通常時は完全に消す */
}

.swiper-fade .swiper-slide-active {
  pointer-events: auto;
  opacity: 1 !important; /* アクティブな時だけ表示する */
}

/* fade in */

/* 表示前の状態 */
.element {
  opacity: 0;            /* 透明 */
  transform: translateY(30px); /* 30px下に下げておく */
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* JavaScriptでこのクラスが付与されたら表示する */
.element.is-visible {
  opacity: 1;            /* 不透明にする */
  transform: translateY(0);    /* 元の位置に戻る */
}

/* ---------- Mobile / Tablet ---------- */
@media(max-width:1030px){
    body {
        font-size: 0.875em;
    }

    .no_header article h1{
        font-size: 1.428em;
    }
}

/* ---------- Mobile ---------- */
@media(max-width:737px) {

    img {
        max-width: 100%;
    }

    .no_header article{
        padding-top: 60px;
        padding-left: 16px;
        padding-right: 16px;
    }

    .no_header article h1{
        margin-bottom: 30px;
    }
}

/* ---------- Portlate ---------- */
@media(max-width:567px) {
    article{
        margin-bottom: 40px;
    }
}

/* ---------- Tablet / PC ---------- */
@media (min-width: 738px) {}

/* ---------- Tablet ---------- */
@media(max-width:1030px) and (min-width: 737px){
    article{
        margin-bottom: 60px;
    }

    .no_header article{
        max-width: 982px;
        padding-top: 98px;
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom: 60px !important;
    }

    .no_header article h1{
        margin-bottom: 40px;
    }
}

/* ---------- PC ---------- */
@media(min-width:1031px){

    .with_header article,
    .no_header article{
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 125px !important;
    }

    .no_header article{
        padding-top:120px;
        padding-left:20px;
        padding-right: 20px;
        max-width: 1920px;
    }

    .with_header article h1,
    .no_header article h1{
        font-size: 2.25em;
        margin-bottom: 48px;
    }
}