/* Theme Name: request Theme URI: Author: Author URI: Description: Version: 1.0 License: License URI: Tags: Text Domain: */ @charset "UTF-8"; /*-------------------------------------------------- ************************************************** リセット ************************************************** --------------------------------------------------*/ /* 内で html5reset.css を読み込んでます */ /*-------------------------------------------------- ************************************************** デフォルト ************************************************** --------------------------------------------------*/ /* 内で default.css を読み込んでます */ /*-------------------------------------------------- ************************************************** 基本 ************************************************** --------------------------------------------------*/ body { margin:0px; padding:0px; background:none repeat scroll 0% 0%; background-attachment:scroll; font-family: 'Barlow', "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; /* ゴシック */ /* font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; */ /* 明朝体 */ line-height: 1.6; letter-spacing: 0.8px; font-size: 14px; font-weight: 400; color:#333; width:100%; overflow-x:hidden; } img{ vertical-align:bottom; } #wrapper{ position:relative; } .contents_inner{ max-width:1200px; width:90%; margin-left:auto; margin-right:auto; } body::after { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color:#FFF; z-index: 9999; pointer-events: none; opacity: 0; -webkit-transition: opacity .8s ease; -ms- transition: opacity .8s ease; -moz- transition: opacity .8s ease; transition: opacity .8s ease; } body.fadeout::after { opacity: 1; } body.company_body.fadeout::after { opacity: 0 !important; } /*-------------------------------------------------- ************************************************** テキスト・フォント ************************************************** --------------------------------------------------*/ .red { color:#ff0000;} .blue { color:#0000ff;} .green { color:#008000;} .black { color:#000; } .white { color:#fff; } .Noto_Serif{ font-family:'Noto Serif JP', serif; } .mincho{ font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho",serif; } /*-------------------------------------------------- ************************************************** リンク系（アンカー） ************************************************** --------------------------------------------------*/ a { color: #CC0000; text-decoration: none; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } a:hover { color: #CC0000; text-decoration: underline; } a img{ display: block; transition: 0.5s; } a img:hover { opacity: 0.7; transition: 0.5s; } /* -- CSSで画像を整形していたら -- */ a.opa:hover { -ms-filter: "alpha( opacity=70 )"; filter: alpha( opacity=70 ); opacity: 0.7; } /* -- 電話番号のリンクを無効 -- */ a[href^="tel:"] { pointer-events:none; color:#404040; } /*-------------------------------------------------- ************************************************** ヘッダー ************************************************** --------------------------------------------------*/ #top_header { width:100%; position:absolute; top:0; left:0; z-index:1; background:rgba(255,255,255,.85); } .hd_home{ width:1200px; max-width:95%; margin:0 auto; padding:50px 0; align-items:center; } #top_header .hd_home{ padding:20px 0 !important; } .hd_logo{ width:220px; } .hd_home ul { display:flex; } .hd_home ul li { margin-left:30px; } .hd_home ul li a { color:#000; font-size:13px; font-weight:500; display:block; position:relative; } .hd_home ul li a:hover { text-decoration:none; } .hd_home ul li a::after { content: ''; display: block; width: 0; height: 1px; background: #e63c3c; position: absolute; bottom: -10px; left: 0; transition: .5s; } .hd_home ul li a:hover::after { width: 100%; } #nav_wrap { display:block; } /*-------------------------------------------------- ************************************************** グローバルナビゲーション ************************************************** --------------------------------------------------*/ /*-------------------------------------------------- ************************************************** パンくず ************************************************** --------------------------------------------------*/ .breadcrumb{ max-width:1200px; width:90%; margin:0 auto; font-size:13px; color:#111; font-weight:500; padding:30px 0; /*! background:#fcfcfc; */ } .breadcrumb a{ color:#111; margin:0 10px 0 0; } .breadcrumb > span > span{ color: #111; margin:0 10px; } /*-------------------------------------------------- ************************************************** メインコンテンツ ************************************************** --------------------------------------------------*/ /*-------------------------------------------------- ************************************************** 下層ページ ************************************************** --------------------------------------------------*/ section h1 { width:1200px; max-width:90%; margin:0 auto; font-size:60px; } section h1 span { display:block; font-size:14px; color:#e63c3c; position:relative; padding-left:70px; } section h1 span::before { content:""; width:60px; height:1px; background:#e63c3c; position:absolute; left:0; top:10px; } /*-------------------------------------------------- ************************************************** モジュール系 ************************************************** --------------------------------------------------*/ .box_shadow_1{ box-shadow:15px 15px 12px 0px rgba(33,55,64,0.3); } /*-------------------------------------------------- ************************************************** フッター ************************************************** --------------------------------------------------*/ footer { margin-top:90px; background:#f5f5f5; padding:50px 0 0; } footer.common_footer { margin-top:0 !important; } footer .contents_inner { display:flex; justify-content:space-between; } .footer_sitemap .footer_logo { width:220px; height:43px; } .footer_sitemap ul { margin-top:40px; } .footer_sitemap ul li { margin:10px 0 0; } .footer_sitemap ul li a { font-size:14px; color:#000; font-weight:500; } .footer_sitemap ul li a:hover { color:#e63c3c; text-decoration:none; } .footer_info ul { display:flex; justify-content:flex-end; } .footer_info ul li { margin-left:20px; } .footer_info ul li a { width:200px; height:120px; display:flex; background:#FFF; justify-content:center; align-items:center; color:#e63c3c; font-size:14px; font-weight:500; } .footer_info ul li:nth-child(2) a { width:200px; height:120px; display:flex; color:#FFF; justify-content:center; align-items:center; background:#e63c3c; font-size:16px; font-weight:500; pointer-events:none; } .footer_info ul li a span { display:block; background:url(imgs/common/icon_mail_red.png) no-repeat center top; background-size: 46px 36px; padding-top:56px; line-height:1em; } .footer_info ul li:nth-child(2) a span { display:block; background:url(imgs/common/icon_tel_white.png) no-repeat center top; background-size: 35px 38px; padding-top:56px; line-height:1em; } .footer_info ul li a:hover { text-decoration:none; box-shadow:0 10px 15px rgba(51,51,51,.2); } .footer_info .footer_address { text-align:right; margin-top:20px; } .footer_address .company_name { font-size:18px; font-weight:700; } .footer_address .license { margin-top:5px; font-size:12px; font-weight:500; line-height:1.8em; } .footer_address .f_address { margin-top:5px; font-weight:500; font-size:13px; line-height:1.8em; } .footer_address .f_address a { color:#111; text-decoration:none; pointer-events:none; } .f_btn_arrow { margin-top:20px; margin-left:auto; height:60px; } .f_btn_arrow a { border:1px solid #000; color:#000; font-size:16px; padding:10px 30px; display:inline-block; font-weight:500; } .f_btn_arrow a span { position:relative; display:flex; align-items:center; justify-content:center; } .f_btn_arrow a span::after { content: ''; width: 60px; height: 5px; border-bottom: solid 1px; border-right: solid 1px; transform: skew(45deg); margin-left:20px; } .f_btn_arrow a:hover { text-decoration:none; background:#000; color:#FFF; } #copyright{ padding:30px 0; background:#e63c3c; color:#FFF; font-size:13px; letter-spacing:0.1em; margin-top:50px; } #copyright small{ font-size:13px; } /*-------------------------------------------------- ************************************************** その他 (PageUpボタン 追従系 jsに関わるcssなど。) ************************************************** --------------------------------------------------*/ /* フェードイン */ .scroll_fade_bottom{ opacity:0; transform:translateY(150px); transition:1200ms; } .scroll_fade_right{ opacity:0; transform:translateX(150px); transition:1200ms; } .scroll_fade_left{ opacity:0; transform:translateX(-150px); transition:1200ms; }