@charset "UTF-8";

.container{position:relative;width:100%; padding:0 .8rem;margin:0 auto;}
.hidden-text{display:none;}

html{
    width:100vw;
    height:100vh;
    position:relative;
    overflow-x:hidden;
}

body{
    width:100vw;
    height:100vh;
    position:relative;
}

header.global{
    background:rgba(255,255,255,0.9);
    width:100%;
    height:4.4rem;
    line-height:4.4rem;
    position:fixed;
    top:0;
    left:0;
    z-index:9999;
    border-bottom:1px solid #ecf0f1;
    box-sizing:border-box;
}

header.global h1{
    font-size:1rem;
    font-weight:normal;
    display:inline-block;
    position:absolute;
    top:4px;
    left:8px;
    right:0;
    margin:0 auto;
    line-height:1;
    text-align:center;
}

header.global a#logo{
    vertical-align:top;
    display:block;
    width:24rem;
    margin:0 auto;
    line-height:4.4rem;
    text-indent:-9999rem;
    background:url('/img/logo-gray.png') no-repeat center center;
    background-size:100% auto;
}

header.global a.tel-number{
    display:none;
}

header.global a.tel-number > span{
    display:none;
}

header.global a.subscription-button{
    display:none;
}

em{
    font-style:normal;
    font-weight:normal;
}

/** コンテンツコンテナ */
div#content{
    /*padding:4.8rem 0;*/
}

.annual-plan {
    margin-bottom: 30px;
}

/** section共通 */
section{
    width:100vw;
    clear:both;
    padding:5.2rem 0;
}

section:last-of-type{
    padding-bottom:6.4rem;
}

section:nth-of-type(odd){
    background:#f098b1;
    color:#fff;
}

section h2{
    line-height:4.8rem;
    font-weight:normal;
    font-size:1.8rem;
    box-sizing:border-box;
    margin-bottom:2rem;
}

section h2:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\2713';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:2rem;
    margin-right:.4rem;
}

section:nth-of-type(even) h2{
    color:#e84393;
    /*border-bottom:2px solid #f098b1;*/
    border-bottom:2px solid #e84393;
}

section:nth-of-type(odd) h2{
    border-bottom:2px solid #fff;
}

/** アイキャッチ */
section#eye-catch{
    padding:4.4rem 0 0;
    position:relative;
    background:url('/img/eye-catch.png') no-repeat center 15vh;
    background-size:90% auto;
    height:100vh;
}

section#eye-catch > p.catch-text{
    border-radius:.8rem;
    position:absolute;
    top:0;
    left:0;
    bottom:20vh;
    right:0;
    margin:auto;
    width:24rem;
    height:12rem;
    background-size:190px auto;
    text-indent:-9999rem;
}

section#eye-catch > a{
    position:absolute;
    bottom:20vh;
    left:0;
    right:0;
    margin:auto;
    display:block;
    width:24rem;
    text-align:center;
    text-decoration:none;
    font-size:1.6rem;
    line-height:4.4rem;
    height:4.4rem;
    border:2px solid #e84393;
    color:#e84393;
    background:rgba(255,255,255,0.75);
    border-radius:.4rem;
    box-sizing:border-box;
}

section#eye-catch > a:after{
    font-family:'WebHostingHub-Glyphs';
    content:'\f387';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:2rem;
    margin-left:.4rem;
}

/** 概要紹介 */
section#introduction{
    padding-top:0;
}

section#introduction .introduction-text{
    background:url('/img/introduction-text_sp.png') no-repeat center center;
    background-size:100% auto;
    height:16rem;
    max-width:36rem;
    margin:0 auto;
}

section#introduction p{
    display:none;
    font-size:1rem;
    line-height:2;
}

section#introduction p:not(:first-of-type){
    margin-top:1.6rem;
}

section#introduction strong{
    font-size:1.8rem;
    font-weight:normal;
    color:#f098b1;
}

h2 > strong{
    font-weight:normal;
}

/** メディア掲載情報 */
h2.media{
    margin-top:4rem;
}

h2.media:before{
    content:'\f64f';
}

h2.media + article > ul{
    list-style:none;
}

h2.media + article > ul > li{
    line-height:2.4rem;
    padding:.8rem;
    border-radius:.4rem;
    border:1px solid #e84393;
    box-shadow:0 1px 2px rgba(0,0,0,0.25);
}

h2.media + article > ul > li > a{
    display:block;
    height:100%;
    position:relative;
    padding-left:3.2rem;
    color:#e84393;
}

h2.media + article > ul > li > a:before{
    position:absolute;
    top:0;
    left:0;
    font-family:'WebHostingHub-Glyphs';
    content:'\f388';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:2.4rem;
}

/** 特徴 */
section#feature h2:before{
    content:'\f20a';
}

section#feature p{
    margin-bottom:1rem;
}

section#feature ul{
    list-style:none;
}

section#feature ul > li{
    font-size:1.6rem;
    background:#fff;
    color:#e84393;
    border-radius:.4rem;
    padding:.8rem .8rem .8rem 3.6rem;
    line-height:3.2rem;
    box-shadow:0 1px 2px rgba(0,0,0,0.25);
    position:relative;
}

section#feature ul > li > strong{
    font-weight:inherit;
}

section#feature ul > li:not(:first-of-type){
    margin-top:1rem;
}

section#feature ul > li:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f138';
    display:inline-block;
    border-radius:1.6rem;
    text-align:center;
    margin-right:.8rem;
    vertical-align:bottom;
    font-size:2.4rem;
    color:#e84393;
    font-weight:normal;
    position:absolute;
    top:.8rem;
    left:.8rem;
}

/** 補償内容 */
section#compensation h2:before{
    content:'\f2e3';
}

section#compensation p{
    margin-bottom:1rem;
    line-height:2.4rem;
}

section#compensation p > strong.price{
    color:#e84393;
    font-size:2rem;
    font-weight:normal;
}

section#compensation ul{
    list-style:none;
}

section#compensation ul > li{
    font-size:1.6rem;
    background:#fff;
    /*color:#7f8c8d;*/
    /*color:#e84393;*/
    border:2px solid #e84393;
    border-radius:.4rem;
    box-sizing:border-box;
    padding:.8rem;
    line-height:3.2rem;
    box-shadow:0 1px 2px rgba(0,0,0,0.25);
}

section#compensation ul > li > strong{
    font-weight:inherit;
}

section#compensation ul > li:not(:first-of-type){
    margin-top:1rem;
}

section#compensation ul > li:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f310';
    display:inline-block;
    border-radius:1.6rem;
    text-align:center;
    margin-right:.8rem;
    vertical-align:bottom;
    font-size:2.4rem;
    color:#e84393;
    font-weight:normal;
}

section#compensation ul + p{
    margin-top:1rem;
}

a.download-link{
    display:inline-block;
    vertical-align:middle;
    line-height:4.4rem;
    height:4.4rem;
    padding:0 .8rem;
    box-sizing:border-box;
    background:#ecf0f1;
    border-bottom:2px solid #bdc3c7;
    color:#e84393;
    border-radius:.4rem;
    text-align:center;
}

/** プラン紹介 */
section#plan h2:before{
    content:'\f73f';
}

section#plan article{
    max-width:32rem;
    margin:0 auto .8rem;
    background:#fff;
    display:block;
    border-radius:.4rem;
    padding:.8rem;
    color:#7f8c8d;
    box-shadow:1px 1px 2px rgba(0,0,0,0.25);
    border: 3px solid #f098b1;
}

section#plan article > h3{
    font-size:1.4rem;
    border-bottom:1px solid #f098b1;
    color:#f098b1;
    line-height:3.2rem;
    margin-bottom:.8rem;
}

section#plan article > h3:before{
    content:" ";
    width:2.4rem;
    height:2.4rem;
    display:inline-block;
    background:url('/img/icon.png') no-repeat center center;
    background-size:contain;
    vertical-align:middle;
    margin-right:.4rem;
}

section#plan article > p.plan-name{
    font-size:2rem;
}

section#plan article > p.plan-name > strong{
    color:#e84393;
    font-size:2.4rem;
    font-weight:normal;
}

section#plan article > p.price{
    text-align:center;
    font-size:1.6rem;
}

section#plan article > p.price > strong{
    color:#e84393;
    font-size:4.8rem;
    font-weight:normal;
}

section#plan article > p.subscription{
    text-align:center;
}

a.subscription-button{
    display:inline-block;
    margin:0 auto;
    padding:0 1.2rem;
    background:#e74c3c;
    border-bottom:2px solid #c0392b;
    border-radius:.4rem;
    height:100%;
    box-sizing:border-box;
    text-align:center;
    color:#fff;
    text-decoration:none;
    line-height:4.4rem;
    font-size:1.6rem;
}

a.subscription-button:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f388';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    margin-right:.2rem;
}

header .pre-text{
    display:none;
}

.pre-text{
    display:block;
    text-align:center;
    line-height:4.4rem;
    color:#c0392b;
    border:2px solid #c0392b;
    box-sizing:border-box;
    padding:0 .8rem;
    border-radius:.4rem;
}

/** よくあるご質問 */
section#faq h2:before{
    content:'\f0a3';
}

section#faq dl {
    background-color: #FFF;
    margin-bottom: 1rem;
    padding: 1.6rem;
    color: #666;
    border-radius: 1.6rem;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
}

section#faq dl >dt:before{
    content:'Q.';
    font-size:large;
    display:inline-block;
    margin-right:.4rem;
    font-weight:bold;
}

section#faq dl > dt{
    line-height:3.2rem;
    font-size:1.6rem;
    position:relative;
    color:#2980b9;
}

section#faq dl > dt:not(:first-of-type){
    margin-top:1.2rem;
}

section#faq dl > dd{
    margin:.4rem 0 0;
    padding:.4rem 0 0 1.6rem;
    position:relative;
    line-height:3.2rem;
    white-space:normal;
    word-wrap:break-word;
    font-size:1.4rem;
}

/** 会社概要画面 */
body.company section:first-of-type{
    padding-top:6.4rem;
}

body.company section{
    background:#fff;
    color:#666;
}

body.company section h2{
    border-color:#666;
}

body.company section h3{
    font-size:1.6rem;
    font-weight:normal;
    background:#ecf0f1;
    color:#2c3e50;
    line-height:3.2rem;
    padding:0 .8rem;
}

body.company h2:before{
    content: '\f0d7';
}

#company article{
    margin-bottom:4rem;
}

.company-profile > h3:before{
    font-family: 'WebHostingHub-Glyphs';
    content: '\f245';
    display: inline-block;
    text-decoration: none;
    vertical-align: bottom;
    font-size:1.8rem;
    margin-right: .4rem;
}

#company table{
    border:0;
    width:100%;
    border-bottom:1px solid #bdc3c7;
}

#company th{
    width:10rem;
    line-height:4.4rem;
    padding:0 .4rem;
}

#company td{
    min-height:4.4rem;
}

#company td .inline-label{
    display:inline-block;
    width:3.6rem;
}

.company-history > h3:before{
    font-family: 'WebHostingHub-Glyphs';
    content: '\f764';
    display: inline-block;
    text-decoration: none;
    vertical-align: bottom;
    font-size:1.8rem;
    margin-right: .4rem;
}

.company-policy > h3:before{
    font-family: 'WebHostingHub-Glyphs';
    content: '\f4c2';
    display: inline-block;
    text-decoration: none;
    vertical-align: bottom;
    font-size:1.8rem;
    margin-right:.4rem;
}

.company-policy ul{
    margin-left:.8rem;
}

/** お問合せ */
article.inquiry{
    text-align:center;
    /*font-size:1.6rem;*/
    line-height:1;
    margin-top:2rem;
}

a.inquiry-button{
    display:inline-block;
    margin:.4rem auto;
    padding:0 1.2rem;
    border-radius:.4rem;
    box-sizing:border-box;
    text-align:center;
    text-decoration:none;
    line-height:4.4rem;
    font-size:1.4rem;
    vertical-align:bottom;
    background:#ecf0f1;
    border-bottom:2px solid #bdc3c7;
}

a.inquiry-button:before{
    font-family:'WebHostingHub-Glyphs';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    margin-right:.4rem;
    font-size:2rem;
}

a.inquiry-button.mail:before{
    content:'\f136';
}
a.inquiry-button.mail{
    color:#3498db;
}

a.inquiry-button.tel:before{
    content:'\f148';
}
a.inquiry-button.tel{
    color:#e67e22;
}

/*
 お問合せ画面
 */
body.inquiry section{
    padding-top:7.2rem;
    min-height:100vh;
    background:transparent;
    color:#666;
}

body.inquiry h2{
    color:#f098b1;
    border-bottom:2px solid #f098b1;
}

body.inquiry h2:before{
    content:'\f136';
}


input[type="text"]{
    width:100%;
    /*margin-bottom:1rem;*/
}

textarea{
    width:100%;
    height:25vh;
}

button{
    display:block;
    margin:1rem auto;
    background:#3498db;
    color:#fff;
    border:0;
    border-bottom:2px solid #2980b9;
}

button.disabled{
    border-color:#bdc3c7;
}

.vertical > label{
    display:block;
}

input.ng,
textarea.ng{
    border-color:#e74c3c;
    background:#fee;
}

input.ok,
textarea.ok{
    border-color:#2ecc71;
    background:#efe;
}

label.ok:after{
    font-family:'WebHostingHub-Glyphs';
    content:'\2713';
    color:#2ecc71;
    display:inline-block;
    text-decoration:none;
    vertical-align:top;
    margin-left:.4rem;
}

label.ng{
    color:#e74c3c;
}

label.ng:after{
    font-family:'WebHostingHub-Glyphs';
    content:'\00d7';

    display:inline-block;
    text-decoration:none;
    vertical-align:top;
    margin-left:.4rem;
}

.validate{
    display:none;
}

.validate.ng{
    display:inline-block;
    color:#e74c3c;
}

.validate.ng:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f05a';
    display:inline-block;
    text-decoration:none;
    vertical-align:top;
    margin-right:.2rem;
}

.flash-message{
    line-height:4.4rem;
    border-radius:.4rem;
    padding:0 .8rem;
    background:#ecf0f1;
    color:#7f8c8d;
}

.flash-message.success{
    background:#efe;
    color:#27ae60;
}

.flash-message.error{
    background:#fee;
    color:#e74c3c;
}

.annotation{
    background:#eee;
    border-radius:.4rem;
    padding:.8rem;
    line-height:1.75;
}

.annotation > p:not(:first-of-type){
    margin-top:.8rem;
    line-height:1.75;
}

.button.return{
    display:table;
    margin:1rem auto;
    background:#f098b1;
    color:#fff !important;
    border:0;
    border-bottom:2px solid #f07690;
}

/** エラー画面 */
section#error{
    background:#fff;
    color:#666;
    padding-top:8.8rem;
}

section#error h2{
    color:#c0392b;
    border-color:#c0392b;
}

section#error h2:before{
    content: '\f05a';
}

/** フッター */
a.to-top{
    display:block;
    line-height:4.4rem;
    background:#bdc3c7;
    color:#fff;
    text-align:center;
    font-size:3.2rem;
    clear:both;
}

footer.global{
    clear:both;
    background:#ecf0f1;
    padding:1.6rem 0 6.4rem;
    color:#666;
}

footer.global article.company-information{
    width:80vw;
    max-width:24rem;
    margin:0 auto;
}

footer.global a[target="_blank"]:before{
    content:'';
}

ul.sitemap{
    list-style:none;
    padding:0 0 1.6rem;
}

ul.sitemap > li{
    line-height:4rem;
    text-decoration:none;
    font-size:1.4rem;
}

ul.sitemap > li > a{
    display:block;
    width:100%;
    height:100%;
    color:#e84393;
}

ul.sitemap > li > a:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f488';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:1rem;
    margin-right:.2rem;
}

.company-banner{
    display:block;
    background:#fff;
    padding:2.4rem;
    border-radius:.4rem;
    position:relative;
}

.company-banner > p.catch{
    font-size:small;
    color:#7f8c8d;
}

.company-banner > p.name{
    width:24rem;
    height:2.4rem;
    text-indent:-9999rem;
    background:url('/img/logo-company_icon_text.png') no-repeat center center;
    background-size:100% auto;
    margin-bottom:.8rem;
}

.company-banner > p.tel,
.company-banner > p.fax{
    font-size:2rem;
    color:#e84393;
    letter-spacing:.2rem;
}

.company-banner > p.tel > strong,
.company-banner > p.fax > strong{
    font-weight:normal;
}

.company-banner > p.tel:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f148';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:2rem;
    width:2.8rem;
    text-align:center;
}

.company-banner > p.fax:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f125';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    width:2.8rem;
    text-align:center;
    font-size:2rem
}

.company-banner > p.address{
    margin-top:.8rem;
}

article.sns-container{
    clear:both;
    text-align:center;
    margin:1.6rem auto;
}

article.sns-container > h4{
    font-size:2rem;
}

article.sns-container > ul{
    display:inline-table;
    margin:0 auto;
    border-spacing:.2rem;
}

article.sns-container > ul > li{
    display:table-cell;
}

article.sns-container > ul > li > a{
    display:block;
    /*width:4.4rem;*/
    padding:0 .4rem;
    height:4.4rem;
    line-height:4.4rem;
    border-radius:.4rem;
    color:#fff;
    text-align:center;
    border-bottom:2px solid transparent;
    box-sizing:border-box;
}

article.sns-container > ul > li.facebook > a{
    background:#305097;
    border-color:#103097;
}

article.sns-container > ul > li.twitter > a{
    background:#00aced;
    border-color:#008ccd;
}

article.sns-container > ul > li > a > i.icon{
    font-size:2.4rem;
}

p.copyright{
    text-align:center;
    line-height:4rem;
}

/** 固定お申込みボタン */
nav.subscription{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:5.2rem;
    padding:.4rem;
    background:rgba(255,255,255,0.8);
    z-index:9999;
}

nav.subscription > a{
    display:block;
    margin:0 auto;
    width:100%;
    background:#e74c3c;
    border-bottom:2px solid #c0392b;
    border-radius:.4rem;
    box-sizing:border-box;
    text-align:center;
    color:#fff;
    text-decoration:none;
    height:4.4rem;
    line-height:4.4rem;
    font-size:1.6rem;
}

nav.subscription > a:before{
    font-family:'WebHostingHub-Glyphs';
    content:'\f756';
    display:inline-block;
    text-decoration:none;
    vertical-align:bottom;
    font-size:2rem;
    margin-right:.4rem;
}

/** メンテナンスページ */
section#maintenance{
    padding:8rem 0;
    background:#fff;
    color:#666;
}

section#maintenance p {
    font-size:1.6rem;
}

@media screen and (min-width: 480px){

    .container{position:relative;width:480px; margin:0 auto;}

    header.global h1{
        top:.4rem;
        left:5.4rem;
        text-align:left;
    }

    header.global a#logo{
        display:inline-block;
    }

    header.global a.tel-number{
        display:inline-block;
        position:absolute;
        bottom:0;
        right:.8rem;
        margin-left:4rem;
        font-size:2rem;
        font-weight:bold;
        border-radius:.4rem;
        box-sizing:border-box;
        text-decoration:none;
        color:#f19db4;
        height:4.4rem;
        line-height:4.4rem;
        vertical-align:bottom;
    }

    header.global a.tel-number:before{
        font-family:'WebHostingHub-Glyphs';
        content:'\f148';
        display:inline-block;
        text-decoration:none;
        margin-right:.4rem;
        font-size:2rem;
        vertical-align:bottom;
    }

    /** コンテンツコンテナ */
    div#content{

    }

    /** アイキャッチ */
    section#eye-catch{
        background-size:90% auto;
    }

    section#eye-catch > p.catch-text{
        width:24rem;
        height:12rem;
        background-size:190px auto;
    }

    section#eye-catch > a{
        max-width:32rem;
    }

    /** 概要 */
    section#introduction .introduction-text{
        background:url('/img/introduction-text.png') no-repeat center center;
        background-size:100% auto;
        height:16rem;
        max-width:48rem;
        margin:0 auto;
    }

    /** プラン紹介 */
    section#plan article{
        max-width:32rem;
        margin:0 auto .8rem;
    }

    nav.subscription > a{
        max-width:32rem;
    }

    /** フッター */
    ul.sitemap{
        display:inline-block;
    }

    .company-banner{
        float:right;
        padding:7.2rem 1.2rem;
        display:inline-block;
    }

}

@media screen and (min-width: 480px) and (max-height: 480px){
    section#eye-catch{
        background-position-y:6.4rem;
        background-size:auto 80%;
    }
}

@media screen and (min-width: 768px){

    .container{position:relative;width:640px; margin:0 auto;}

    header.global{
        line-height:5.2rem;
        height:5.2rem;
    }

    header.global h1{
        top:.4rem;
        left:5.4rem;
        text-align:left;
    }

    header.global a#logo{
        /*top:.4rem;*/
        display:inline-block;
    }


    header.global a.tel-number{
        display:inline-block;
        position:relative;
        margin-left:1.6rem;
        height:5.2rem;
        line-height:5.2rem;
        font-size:2rem;
        vertical-align:bottom;
        font-weight:bold;
    }

    header.global a.tel-number:before{
        font-size:2rem;
        font-weight:normal;
    }

    header.global a.subscription-button{
        vertical-align:middle;
        top:auto;
        position:relative;
        line-height:6.4rem;
        height:6.4rem;
        font-size:2rem;
        padding:0 4rem;
        border-width:.4rem;
        box-sizing:border-box;
        background:#e74c3c;
        border-color:#c0392b;
    }


    header.global a.subscription-button{
        display:inline-block;
        vertical-align:top;
        position:absolute;
        top:4px;
        right:4px;
        height:4.4rem;
        line-height:4.4rem;
        font-size:1.6rem;
        border-width:2px;
        padding:0 2rem;
    }

    header.global a.subscription-button:before{
        content:'\f756';
        margin-right:.4rem;
    }

    header .pre-text{
        display:inline-block;
    }

    /** アイキャッチ */
    section#eye-catch{
        padding:5.2rem 0 0;
        background:url('/img/eye-catch_pc.png') no-repeat center center;
        background-size:640px auto;
    }

    section#eye-catch > p.catch-text{
        width:48rem;
        height:16rem;
        background-size:380px auto;
    }

    section#eye-catch > a{
        bottom:10vh;
    }

    /** 概要紹介 */
    section#introduction{
        padding-top:0;
    }

    section#introduction .introduction-text{
        height:20rem;
        max-width:64rem;
        margin:0 auto;
    }

    section#introduction p{
        display:none;
        font-size:1.8rem;
        line-height:2;
    }

    section#introduction p:not(:first-of-type){
        margin-top:1.6rem;
    }

    section#introduction strong{
        font-size:2.7rem;
        font-weight:normal;
        color:#f098b1;
    }


    /** プラン紹介 */
    section#plan{
        text-align:center;
    }

    section#plan h2{
        text-align:left;
    }

    section#plan article{
        text-align:left;
        max-width:32rem;
        margin:0;
        display:inline-block;
    }

    section#plan article:first-of-type{
        margin-right:1rem;
    }

    nav.subscription{
        display:none;
    }

    body.inquiry > div#content{
        padding-top:8rem;
    }

    /** メンテナンスページ */
    section#maintenance{
        padding:12rem 0;
        background:#fff;
        color:#666;
    }

    /** フッター */
    .company-banner{
        width:50%;
    }

}

@media screen and (min-width: 768px) and (max-height:768px){
    section#eye-catch{
        background-position-y:6.4rem;
        background-size:auto 80%;
    }
}

@media screen and (min-width: 960px){

    .container{position:relative;width:960px; margin:0 auto;}

    header.global{
        background:rgba(255,255,255,0.9);
        width:100%;
        height:8rem;
        line-height:8rem;
        position:fixed;
        top:0;
        left:0;
        z-index:9999;
        border-bottom:1px solid #bdc3c7;
        box-sizing:border-box;
    }

    header.global h1{
        font-size:1.4rem;
        font-weight:normal;
        display:inline-block;
        position:absolute;
        top:1.6rem;
        left:7.6rem;
        margin:0 auto;
        line-height:1;
    }

    header.global a#logo{
        vertical-align:middle;
        display:inline-block;
        width:36rem;
        height:6rem;
    }

    header.global a.tel-number{
        display:inline-block;
        height:6rem;
        line-height:6rem;
        font-size:3.2rem;
        vertical-align:bottom;
        margin-left:2rem;
    }

    header.global a.tel-number:before{
        font-size:3.2rem;
    }

    header.global a.tel-number > span{
        display:inline-block;
        position:absolute;
        top:-2.4rem;
        left:0;
        font-weight:bold;
        font-size:1.6rem;
        color:#f19db4;
    }

    header.global a.subscription-button{
        vertical-align:middle;
        position:absolute;
        top:.8rem;
        right:0;
        line-height:6.4rem;
        height:6.4rem;
        font-size:2rem;
        padding:0 4.8rem;
        border-width:4px;
    }

    section h2{
        font-size:3.6rem;
    }

    h2.media{
        margin-top:8rem;
    }

    h2.media + article > ul > li{
        line-height:6.4rem;
        padding:0 1.2rem;
        border-radius:.4rem;
        border:2px solid #e84393;
        box-shadow:0 1px 2px rgba(0,0,0,0.25);
    }

    h2.media + article > ul > li > a{
        padding-left:0;
        font-size:2rem;
    }

    h2.media + article > ul > li > a:before{
        position:relative;
        font-family:'WebHostingHub-Glyphs';
        content:'\f388';
        display:inline-block;
        text-decoration:none;
        vertical-align:bottom;
        font-size:2.4rem;
        margin-right:.4rem;
    }

    /** アイキャッチ */
    section#eye-catch{
        padding-top:8rem;
        background:url('/img/eye-catch_pc.png') no-repeat center center;
        background-size:960px auto;
    }

    section#eye-catch > p{
        font-size:4.8rem;
        max-width:64rem;
        height:28rem;
    }

    section#eye-catch > a{
        font-size:2rem;
        line-height:6.4rem;
        height:6.4rem;
        border-radius:.4rem;
        box-shadow:1px 1px 2px rgba(0,0,0,0.25);
        box-sizing:border-box;
        bottom:8vh;
    }

    /** 概要紹介 */
    section#introduction{
        padding:0 0 8rem;
    }

    section#introduction .introduction-text{
        height:28rem;
        max-width:96rem;
        margin:0 auto;
    }

    section#introduction p{
        font-size:2.8rem;
        line-height:2;
    }

    section#introduction p:not(:first-of-type){
        margin-top:2rem;
    }
    section#introduction strong{
        font-size:4rem;
        font-weight:normal;
        color:#f098b1;
    }

    /** 特徴 */
    section#feature h2:before{
        content:'\f20a';
    }

    section#feature p{
        margin-bottom:2rem;
        font-size:2rem;
    }

    section#feature p > strong{
        font-weight:normal;
    }

    section#feature ul{
        list-style:none;
    }

    section#feature ul > li{
        font-size:3.2rem;
        padding:0 1.6rem;
        line-height:8rem;
    }

    section#feature ul > li > strong{
        font-weight:inherit;
    }

    section#feature ul > li:not(:first-of-type){
        margin-top:2rem;
    }

    section#feature ul > li:before{
        font-size:3.2rem;
        position:relative;
        top:0;
        left:0;
    }

    /** 補償内容 */
    section#compensation p{
        margin-bottom:2rem;
        font-size:2rem;
        line-height:2.4rem;
    }

    section#compensation p > strong{
        font-weight:normal;
    }

    section#compensation p > strong.price{
        color:#e84393;
        font-size:2.4rem;
    }

    section#compensation ul{
        list-style:none;
    }

    section#compensation ul > li{
        font-size:3.2rem;
        line-height:8rem;
    }

    section#compensation ul > li > strong{
        font-weight:inherit;
    }

    section#compensation ul > li:not(:first-of-type){
        margin-top:1rem;
    }

    section#compensation ul > li:before{
        font-size:3.2rem;
    }

    section#compensation ul + p{
        margin-top:2rem;
    }

    a.download-link{
        display:inline-block;
        vertical-align:middle;
        line-height:6.4rem;
        height:6.4rem;
        font-size:1.6rem;
        padding:0 1.6rem;
        border-bottom:3px solid #bdc3c7;
    }

    /** プラン */
    section#plan{
        padding:8rem 0;
    }

    section#plan article{
        width:46rem;
        max-width:48rem;
        margin:0 auto .8rem;
        background:#fff;
        display:inline-block;
        border-radius:.4rem;
        padding:1.6rem;
        color:#7f8c8d;
        box-shadow:1px 1px 2px rgba(0,0,0,0.25);
        border: 3px solid #f098b1;
    }

    section#plan article > h3{
        font-size:2.4rem;
        border-bottom:4px solid #f098b1;
        color:#f098b1;
        line-height:4.8rem;
        margin-bottom:.8rem;
    }

    section#plan article > h3:before{
        content:" ";
        width:4rem;
        height:4rem;
        display:inline-block;
        background:url('/img/icon.png') no-repeat center center;
        background-size:contain;
        vertical-align:middle;
        margin-right:.8rem;
    }

    section#plan article > p.plan-name{
        font-size:2.4rem;
        margin-bottom:2rem;
    }

    section#plan article > p.plan-name > strong{
        color:#e84393;
        font-size:4rem;
        font-weight:normal;
    }

    section#plan article > p.price{
        text-align:center;
        font-size:2.4rem;
        margin-bottom:2rem;
    }

    section#plan article > p.price > strong{
        color:#e84393;
        font-size:6.4rem;
        font-weight:normal;
    }

    section#plan article > p.subscription{
        text-align:center;
    }

    a.subscription-button{
        display:inline-block;
        margin:0 auto;
        padding:0 1.2rem;
        border-radius:.4rem;
        height:6.4rem;
        box-sizing:border-box;
        text-align:center;
        color:#fff;
        text-decoration:none;
        line-height:6.4rem;
        font-size:2rem;
    }

    /** FAQ */
    section#faq dl > dt{
        font-size:2rem;
    }

    section#faq dl > dt:before{
        font-size:2.4rem;
    }

    section#faq dl > dd{
        font-size:1.6rem;
    }

    article.inquiry{
        font-size:1.6rem;
    }

    /** お問合せ */
    section#inquiry{
        padding:8rem 0;
    }

    section#inquiry article{
        text-align:center;
        font-size:2.4rem;
        line-height:1;
    }

    a.inquiry-button{
        padding:0 2.4rem;
        /*border-width:4px;*/
        line-height:6.4rem;
        height:6.4rem;
        font-size:2rem;
    }

    /** フッター */
    ul.sitemap > li > a{
        font-size:1.6rem;
        line-height:4.4rem;
    }

    .company-banner{
        width:auto;
        padding:4.8rem 3.2rem;
    }

    .company-banner > p.name{
        width:48rem;
        height:4.8rem;
    }

    .company-banner > p.tel,
    .company-banner > p.fax{
        font-size:3.2rem;
    }

    .company-banner > p.tel:before,
    .company-banner > p.fax:before{
        width:5.2rem;
        font-size:3.2rem;
        margin-right:2rem;
    }

    .company-banner > p.address{
        font-size:1.6rem;
    }

    /** 会社概要画面 */
    body.company section:first-of-type{
        padding-top:9.6rem;
    }

}

@media screen and (min-width: 960px) and (max-height: 1080px){
    section#eye-catch{
        background-position-y:8rem;
        background-size:auto 90%;
    }
}

@media all and (-ms-high-contrast:none) {
    body {
        font-family: "メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    }
}