@charset 'UTF-8'; @import url('https://fonts.googleapis.com/css?family=Carrois+Gothic+SC|Julius+Sans+One|Rufina|Seaweed+Script'); /* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 各固定ページ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */ /* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ body直下にid名「wrapper」のdivがあります。 こちらには、固定ページごとに異なるclass名(post-〇)が付与されますので、 ご活用ください。 【例】
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */ /* ================================================================================ レイアウト ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { #wrapper{ background:url(../img/) center top no-repeat; background-color:#e5e5e5; } main.outer_wrap{ position:relative; max-width:1920px; width:100%; min-height:50vh; background:url(../img/) center top no-repeat; display:block; padding:3vw 0 120px; margin:0 auto; } .inner_wrap{ position:relative; max-width:1000px; width:100%; margin:0 auto; } .post-101{ background-color: #22262F!important; } .post-101 main.outer_wrap{ padding-top:0!important; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { #wrapper{ background:url(../img/) center top no-repeat; background-color:#e5e5e5; } main.outer_wrap{ position:relative; width:100%; background:url(../img/) center top no-repeat; padding:8vw 0; } .inner_wrap{ position:relative; width:100%; padding:0 4vw; } .post-101{ background-color: #22262F!important; } .post-101 main.outer_wrap{ padding-top:0!important; } } /* ================================================================================ 各メイン画像 ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .m-cate_wrap{ position: relative; background: -moz-linear-gradient(top, #080e16, #384861); background: -webkit-linear-gradient(top, #080e16, #384861); background: linear-gradient(to bottom, #202b3b, #0f1e35); background-color: rgba(0, 0, 0, 0); background-color: #080e16; width: auto; height: 400px; } .m-cate_wrap_in{ background:url(../img/bg_navi_sp.png) center top repeat; width:100%; height:100%; display:table; } .m-cate_wrap_in h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:16px; letter-spacing:0.05em; line-height:1.3; color:#ffffff; padding-top: 5vw; font-weight:300; } .m-cate_wrap_in h2 span{ font-size: 28px; font-weight: 300; color: #ffffff; font-family: "Fjalla One", sans-serif; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .m-cate_wrap{ position: relative; background: -moz-linear-gradient(top, #080e16, #384861); background: -webkit-linear-gradient(top, #080e16, #384861); background: linear-gradient(to bottom, #080e16, #384861); background-color:#080e16; width: auto; height:50vw; } .m-cate_wrap_in{ background:url(../img/bg_navi_sp.png) center top repeat; width:100%; height:100%; display:table; } .m-cate_wrap_in h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:3vw; letter-spacing:0.05em; line-height:1.3; color:#ffffff; font-weight:300; } .m-cate_wrap_in h2 span{ font-size:8vw; font-weight:300; color:#ffffff; font-family: "Fjalla One", sans-serif; } /* ロゴ */ .h_logo_sp{ position:relative; width:100%; height:0; margin:0 auto; z-index:1; } .h_logo_sp a{ position:relative; background:url(../img/h_logo.png) center top no-repeat; background-size:contain; width: 29%; height: 9vw; display:block; text-indent:-9999px; transform:translate(4vw,4vw); -webkit-transform:translate(4vw,4vw); -ms-transform:translate(4vw,4vw); } } /* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ ここから各固定ページ ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */ /* ================================================================================ 海外遠征 ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .comingsoon{ font-family: 'Rufina', serif; font-size:18px; padding:0 0 0 0; text-align:center; } .com_midashi h2{ font-size: 51px; font-weight: 100; } .com_midashi{ padding: 40px 0 14px 0; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .comingsoon{ font-family: 'Rufina', serif; font-size:3vw; padding:0 0 0 0; text-align:center; } } /* ================================================================================ 〇〇ページ ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .about_text{ text-align: center; padding: 62px; line-height: 30px; background-color: #d4d4d4; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .about_text{ text-align: center; padding: 8vw 3vw; line-height: 6vw; background-color: #d4d4d4; } .kijileft_banner img{ width: 92vw; margin:0 auto; } }