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


*{ margin: 0;padding: 0; outline:none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-appearance: none; box-sizing: border-box; font-feature-settings : "palt"; line-height: 2; letter-spacing: 0.03em; font-weight: normal; }
html { font-size: 62.5%; font-family: "dnp-shuei-gothic-gin-std", sans-serif; }
html .en{ font-family: "freight-text-pro", sans-serif; font-weight: 400; font-style: italic; }
body { font-size: 16px; background: #eceeea; color: #222; text-align: left; position: relative; -webkit-text-size-adjust: 100%; /*min-width: 1200px;*/ }

body.fixed {position: fixed; width: 100%; height: 100%;}

/*  */

p{ font-size: 1.5rem; text-align: left; }
img{border: none; vertical-align: top; max-width: 100%; height: auto; }
table{border-collapse: collapse;}
ul{list-style-type: none;}
a{color: #222; text-decoration: underline; }
a:hover { color: #e04305; text-decoration: underline; }


/* ::::::::::::::::::::::::::::::::: COMMON ::::::::::::::::::::::::::::::::: */

header.header { padding: 100px 0 95px; text-align: center; }

section.video { padding: 0 0 80px; }
section.video div.inner { width: 92%; max-width: 1400px; margin: 0 auto; }
section.video div.thumb { position: relative; background: #222; }
section.video div.thumb img.base { width: 100%; cursor: pointer; transition: opacity 0.4s; }
section.video div.thumb img.btn { position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; transition: transform 0.4s;}
section.video div.thumb:hover img.base { opacity: 0.4; }
section.video div.thumb:hover img.btn { transform: scale(1.1); }
section.video #video { width: 100%; height: auto; aspect-ratio: 16/9; display: none; }

section.main { padding: 0 0 30px; }
section.main div.inner { width: 70%; max-width: 950px; margin: 0 auto; }
section.main h2 { font-size: 3.0rem; line-height: 1.5; font-weight: bold; }
section.main h3 { font-size: 2.4rem; line-height: 1.5; padding: 0 0 30px; }
section.main p { padding: 0 0 30px; font-size: 1.8rem; line-height: 1.8; }
section.main p.tmp span { display: inline-block; padding: 0 20px; border: 1px solid #222; }

footer.footer { padding: 100px 4% 80px; }
footer.footer p.copyright { font-size: 1.6rem; line-height: 1.8; text-align: right; }


/* ::::::::::::::::::::::::::::::::: PC ::::::::::::::::::::::::::::::::: */
@media screen and (min-width: 1000px){
    .sp{ display:none!important; }
    
    .hoverAlpha{ transition: all 0.2s ease; }
    .hoverAlpha:hover{ opacity: 0.8; }
}

/* ::::::::::::::::::::::::::::::::: SP ::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 999px){
    .pc{display:none!important;}

    header.header { }
    header.header img { max-width: 300px; width: 55%; }

    section.video { padding: 0 0 55px; }
    section.video div.inner { width: 100%; }
    section.video div.thumb { }
    section.video div.thumb img.base { }
    section.video div.thumb img.btn { max-width: 120px; width: 22%; }
    section.video div.thumb:hover img.base { }
    section.video div.thumb:hover img.btn { }
    section.video #video { }

    section.main { padding: 0 0 20px; }
    section.main div.inner { width: 88%; }
    section.main h2 { font-size: 2.4rem; line-height: 1.6; }
    section.main h3 { font-size: 2.0rem; line-height: 1.6; padding: 0 0 25px; }
    section.main p { font-size: 1.7rem; line-height: 1.8; }
    section.main p.tmp span { }

    footer.footer { padding: 40px 6% 60px; }
    footer.footer p.copyright { font-size: 1.4rem; line-height: 1.8; }
}