@charset "UTF-8"; /*------------------------------------------------------------------*/ /*-----------------------------base---------------------------------*/ /*------------------------------------------------------------------*/ html { font-size: 62.5%; } body { background-color: #0a0a0a; font-size: 1.55rem; line-height: 1.8; color: #fff !important; letter-spacing: 0.02rem; -webkit-text-size-adjust: 100%; font-weight: 500; } main { background: #0a0a0a; } @media screen and (max-width: 850px) { html { font-size: 55%; } body { letter-spacing: 0px; } } a { outline: 0; text-decoration: none; color: #fff; text-decoration-color: rgba(255,255,255,0.5) !important; } .inner_item_txt a, .inner_item_txt_before a, .inner_item_txt_after a {/*テキストリンクカラー*/ color: #fff; } section[style*="color:"] a, div[style*="color:"] a { color: inherit; } /*composite_boxの最大高さとトリミングの起点*/ /*基本はjsにより各カラム中から最大の画角に設定*/ .composite_box01 .inner_item_img img { object-position: 50% 50%; font-family: 'object-position: 50% 50%;'; } @media screen and (max-width: 850px) { #sidebar { border: 5px solid rgba(255,255,255,0.1); } } /*----------------------------loader----------------------------*/ #load div:nth-of-type(1) { background: #0a0a0a; } #load .loader, .popup .loader { border: 1px solid #998774;/*★*/ } #load .loader, #load .loader::before, .popup .loader, .popup .loader::before { border-top-color: #998774 !important; } #load .loader::before, #load .loader::after, .popup .loader::before, .popup .loader::after {/*★*-1*/ left: -1px; top: -1px; } #load img { max-width: 180px; max-height: 100px; } @media screen and (max-width: 900px) { #load img { max-width: 130px; } } /*----------------------------header----------------------------*/ _:-ms-lang(x), header#pattern1 nav { justify-content: flex-start; } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, header#pattern1 .logo { margin-top: 10px; } } _:-ms-lang(x), header nav ul.nav_1st>li>a { transition: none !important; } header .wraper{ max-width: 1400px !important; } header * { color: #fff !important; } .scrolled header { background: rgba(0,0,0,0.8); } header h1 { line-height: 1.5; font-size: 1.3rem; font-weight: normal; opacity: 0.7; } header .logo { padding: 10px 0; } header .logo, header .logo a { position: relative; } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, header .logo, header .logo a { /* IE11 にのみ適用される */ max-width: 230px; } } header#pattern1 .logo { max-width: 200px; } body.scrolled header .logo { padding: 20px 0 !important; } header .logo a img { transition: 0.3s ease-in-out; transition-property: opacity; position: relative; z-index: 2; } body.scrolled header .logo a img { max-height: 50px; } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, header .logo a img { /* IE11 にのみ適用される */ max-width: 80%; } *::-ms-backdrop, body.scrolled header .logo a img { /* IE11 にのみ適用される */ max-width: 90%; } } header .header_contents .header_col1 { /* ▼水平方向レイアウト */ flex-direction: row; align-items: center; justify-content: flex-end;/* ▼垂直方向レイアウト */ /*flex-direction: column; align-items: flex-end;*/ } header .header_contents .header_col1 .tel { position: relative; font-size: 26px; line-height: 1; padding-left: 26px; font-weight: bold; font-weight: normal; } header .header_contents .header_col1 .tel svg, header .header_contents .header_col1 .btn .translate a svg, header .burger li.sp_translate a svg, header .header_contents .header_sns li svg { fill: #ddd; } header .header_contents .header_sns li svg { fill: #ddd; } header .sp_menu a div span, header .sp_menu a div:before, header .sp_menu a div:after { background: #ddd; } header .header_contents .header_col1 .tel svg { width: 22px; height: 22px; top: calc(50% - 11px); left: 0; } header .header_contents .header_col1 .btn>a { position: relative; display: inline-block; padding: 6px 20px; text-align: center; transition: .3s; font-weight: 500; background: #53493f; color: #fff !important; font-size: 1.3rem; } header .header_contents .header_col1 .btn .translate a svg { max-width: 74%; max-height: 74%; margin: 13% auto 0; } header .header_contents .header_col1 .btn > a:hover { opacity: 1 !important; background: #403830; } header nav { /*background: #5a5a5a;*/ } header nav ul.nav_1st { width: 100%; max-width: 1000px;/*任意*/ } header nav ul.nav_1st>li:after {/*罫線*/ content: ""; display: block; width: 1px; height: 40%; position: absolute; top: 32%; left: 0; border-left: 1px solid rgba(255, 255, 255, 0.2); } header nav ul.nav_1st>li:last-child:before {/*罫線*/ content: ""; display: block; width: 1px; height: 40%; position: absolute; top: 32%; right: 0; border-right: 1px solid rgba(255, 255, 255, 0.2); } header nav ul.nav_1st>li>a { font-size: 1.5rem; font-weight: bold; position: relative; padding-left: 1vw; padding-right: 1vw; letter-spacing: 0.2rem; } header nav ul.nav_1st>li>a span { /*ナビの高さはline-heightで調整*/ line-height: 3.5;/* マージン普通選択時 *//*color: #fff !important; ナビ背景色設定時 */ } header#pattern1 nav ul.nav_1st { width: 75%; max-width: 1300px; } header#pattern1 nav ul.nav_1st>li>a span { line-height: 3; } body.margin header nav ul.nav_1st>li>a span { line-height: 4;/* マージン広い選択時 */ } header#pattern1 nav ul.nav_1st>li>a:before { position: absolute; bottom: 5px; left: 0; content: ''; width: 100%; height: 1px; background: #fff; transform: scale(0, 1); transform-origin: center top; transition: transform .3s; } header#pattern1 nav ul.nav_1st>li>a:hover:before { transform: scale(1, 1); } header nav ul.nav_2nd { padding-top: 20px; } header nav ul.nav_1st>li:hover ul.nav_2nd { padding-top: 10px; } header nav ul.nav_2nd>li { background: rgba(0,0,0,0.9); border-top: 1px solid rgba(255,255,255,0.08); border-bottom: 1px solid rgba(0,0,0,0.5); } header nav ul.nav_2nd>li:nth-last-of-type(1) { border-bottom: none; } header nav ul.nav_2nd>li:first-of-type { border-top: none; } header nav ul.nav_2nd li a { padding: 10px 20px; font-weight: normal; font-size: 1.4rem; color: #fff !important; } header nav ul.nav_2nd>li>a { padding-right: 30px; } header nav ul.nav_2nd>li>a:after { height: 5px; width: 5px; transform: rotate(-45deg); border-right: 1px solid #998774; border-bottom: 1px solid #998774; top: calc(50% - 2.5px); right: 20px; } header nav ul.nav_3rd { padding-left: 20px; } header nav ul.nav_3nd li a { padding: 5px 20px; } header nav ul.nav_3rd>li>a:after { height: 1px; width: 4px; background: #998774; top: calc(50% - 0.5px); left: 5px; } @media screen and (max-width: 900px) { header .header_contents .header_col1 .tel svg, header .header_contents .header_sns li svg { fill: #fff; } header .header_contents .header_col1 .btn > a { background-color: none; color: #fff; border-color: #fff; } .sp_translate svg { transition: 0.3s ease-in-out; } body.scrolled header .logo { padding: 10px 0 !important; } .sp_menu a { padding: 7px 6px 5px; } header.open:after, header .header_contents { background: rgba(0, 0, 0, 0.9); } header .burger li.sp_translate a svg { height: 28px; width: 28px; margin: 10% auto; } header .header_sns, header .header_contents .header_col1, header .header_contents .header_col2 { border-top: 1px solid rgba(255,255,255,0.08); border-bottom: 1px solid rgba(0,0,0,0.5); } header .header_sns { border-bottom: none; } header .header_sns:empty, header .header_contents .header_col1:empty, header .header_contents .header_col2:empty { border: none; } header .header_contents .header_col1 .tel, header .header_contents .header_col1 .btn { float: none; } header .header_contents .header_col2 { display: block !important; } header nav { border-bottom: 1px solid rgba(0,0,0,0.5); } header nav ul.nav_1st { border-bottom: 1px solid rgba(255,255,255,0.08); border-top: 1px solid rgba(0,0,0,0.5); } header nav ul.nav_1st li { border-bottom: 1px solid rgba(0,0,0,0.5); border-top: 1px solid rgba(255,255,255,0.08) !important; } header nav ul.nav_1st>li:before, header nav ul.nav_1st>li:after { display: none !important; } header nav ul.nav_1st>li i:before, header nav ul.nav_1st>li i:after { background: #998774; } header nav ul.nav_2nd { border-top: 1px solid rgba(0,0,0,0.9); } header nav ul.nav_2nd>li { box-shadow: none; } header nav ul.nav_2nd li a { color: #fff!important; } header nav ul.nav_3rd { border-top: 1px solid rgba(0,0,0,0.9); } header nav ul.nav_3rd>li:nth-last-of-type(1) { border-bottom: none; } header nav ul.nav_3rd>li>a:after { background: #998774; } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, header#pattern1 .logo { margin-top: 0px; } } /*SPナビ背景着色時*/ /* header, header *, header nav ul.nav_2nd li a{ color: #fff !important; } header .header_contents .header_col1 .tel svg{ fill: #fff; } header.open .sp_menu a div:before, header.open .sp_menu a div:after{ background: #fff; } header.open .sp_translate svg{ fill: #fff !important; } */ } @media screen and (max-width: 800px) { header .logo, header .logo a { max-width: 150px; position: relative; } header#pattern1.width_full .logo { left: 0px !important; } } /*--▼ヘッダー余白広くしたい時はON--*/ /* body header#pattern3 h1{ padding-top: 50px; padding-bottom: 50px; } body header .logo{ padding-top: 50px; padding-bottom: 50px; } body header .header_contents{ padding-top: 50px; padding-bottom: 35px; } body header#pattern1 .header_contents{ padding-top: 50px; padding-bottom: 15px; } body header#pattern3 .header_contents{ padding-top: 50px; padding-bottom: 50px; } body header .header_contents .header_col1 .tel, body header .header_contents .header_col1 .btn, body header .header_contents .header_col2 .add{ margin-top: 7px; margin-bottom: 7px; } */ /*--▼ヘッダー余白広い 且つ ヘッダーとナビの背景が同色のときはON--*/ /* body header#pattern3 h1{ padding-bottom: 30px; } body header#pattern3 .logo{ padding-bottom: 30px; } body header#pattern3 nav{ padding-bottom: 10px; } */ /*----------------------------余白設定----------------------------*/ /*▽最初のsection*/ main>section:first-child, main>div:first-child, /*▽背景あり&&罫線以外セクション(jsにて.bgを付与)*/ .parallax, main section.bg:not(.contents_hr), main>div.bg:not(.contents_hr), .entry_body>div.bg:not(.contents_hr), aside>div.bg:not(.contents_hr), #primary>div.bg:not(.contents_hr), /*▽背景ありセクションの次のセクション*/ .parallax+*, main section.bg+*, main>div.bg+*, .entry_body>div.bg+*, aside>div.bg+*, #primary>div.bg+* { padding-top: 60px;/* ★1 */ } /*▽背景あり&&罫線以外セクション(jsにて.bgを付与)*/ .parallax, main section.bg:not(.contents_hr), main>div.bg:not(.contents_hr), .entry_body>div.bg:not(.contents_hr), aside>div.bg:not(.contents_hr), #primary>div.bg:not(.contents_hr) { padding-bottom: 70px;/* ★1 */ } /*▽背景なしセクション*/ main section:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), main>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), #primary>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), aside>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), /*▽罫線セクション*/ .contents_hr hr, .contents_hr2 hr, /*▽ブログカテゴリーページ*/ .ssmb { margin-bottom: 70px;/* ★1 */ } /*▽背景なしボタンセクションは上余白をオフセット*/ main section+.contents_btn01:not(.parallax):not(.bg), main>div+.contents_btn01:not(.parallax):not(.bg), .entry_body>div+.contents_btn01:not(.parallax):not(.bg), aside>div+.contents_btn01:not(.parallax):not(.bg), #primary>div+.contents_btn01:not(.parallax):not(.bg), /*▽背景なし見出しのみセクションの次のセクションが背景ないときは上余白をオフセット*/ /*.pt_harf:not(.parallax):not(.bg),*/ /*▽直前のセクションと背景設定が同じセクションは上余白をオフセット*/ .bg2 { margin-top: -35px;/* ★1*-0.5 */ } /*▽ブログ記事内見出しセクション*/ .entry_body>*:nth-child(n+2):not(.parallax):not(.bg)>.content_wrapper>div.heading { /*見出し上余白*/ margin-top: 30px; } /*▽ブログ記事内背景なしセクション*/ .entry_body section:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), .entry_body>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), .entry_body>.contents_hr hr, .entry_body>.contents_hr2 hr, .entry_body>.widget_gallery01>.content_wrapper>div:not(.heading) { margin-bottom: 40px; } @media screen and (max-width: 800px) { /*▽最初のsection*/ main>section:first-child, main>div:first-child, /*▽背景あり&&罫線以外セクション(jsにて.bgを付与)*/ .parallax, main section.bg:not(.contents_hr), main>div.bg:not(.contents_hr), .entry_body>div.bg:not(.contents_hr), aside>div.bg:not(.contents_hr), #primary>div.bg:not(.contents_hr), /*▽背景ありセクションの次のセクション*/ .parallax+*, main section.bg+*, main>div.bg+*, .entry_body>div.bg+*, aside>div.bg+*, #primary>div.bg+* { padding-top: 50px;/* ★2 */ } /*▽背景あり&&罫線以外セクション(jsにて.bgを付与)*/ .parallax, main section.bg:not(.contents_hr), main>div.bg:not(.contents_hr), .entry_body>div.bg:not(.contents_hr), aside>div.bg:not(.contents_hr), #primary>div.bg:not(.contents_hr) { padding-bottom: 50px;/* ★2 */ } /*▽背景なしセクション*/ main section:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), main>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), #primary>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), aside>div:not(.parallax):not(.bg)>.content_wrapper>*:last-child:not(.heading), /*▽罫線セクション*/ .contents_hr hr, .contents_hr2 hr, /*▽ブログカテゴリーページ*/ .ssmb { margin-bottom: 50px;/* ★2 */ } /*▽背景なしボタンセクションは上余白をオフセット*/ main section+.contents_btn01:not(.parallax):not(.bg), main>div+.contents_btn01:not(.parallax):not(.bg), .entry_body>div+.contents_btn01:not(.parallax):not(.bg), aside>div+.contents_btn01:not(.parallax):not(.bg), #primary>div+.contents_btn01:not(.parallax):not(.bg), /*▽背景なし見出しのみセクションの次のセクションが背景ないときは上余白をオフセット*/ /*.pt_harf:not(.parallax):not(.bg),*/ /*▽直前のセクションと背景設定が同じセクションは上余白をオフセット*/ .bg2 { margin-top: -25px;/* ★2*-0.5 */ } } /*----------------------------見出し----------------------------*/ .heading.block_header_1 { display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; padding-bottom: 10px !important; margin-bottom: 30px; border-bottom: solid 1px rgba(83, 73, 63, 0.5); } .heading.block_header_1:before { background: #998774; width: 80px; bottom: -1px; height: 1px; } .heading.block_header_1.align-center:before { left: calc(50% - 40px); } .heading.block_header_1.align-left:before { left: 0; } .heading.block_header_1.align-right:before { right: 0; } .heading.block_header_1 p, .heading.block_header_1 .h:last-child { font-weight: bold; font-weight: 700; font-size: 3.4rem !important; line-height: 1.4; text-transform: uppercase; } .heading.block_header_1 .h { font-size: 1.7rem; font-weight: bold; } @media screen and (max-width: 800px) { .heading.block_header_1 p, .heading.block_header_1 .h:last-child { font-size: 2.5rem !important; } .heading.block_header_1 .h { font-size: 1.5rem !important; } } /*--背景色指定あり且つ文字色指定#FFFのときの見出しデザイン1--*/ section[style*="color: #ffffff; background"] .heading.block_header_1, div[style*="color: #ffffff; background"] .heading.block_header_1 , section[style="color: #ffffff; "] .heading.block_header_1, div[style="color: #ffffff; "] .heading.block_header_1{ border-bottom: solid 1px rgba(255, 255, 255, 0.08); } @media screen and (max-width: 800px) { .heading.block_header_1 { margin-bottom: 20px; padding-bottom: 5px !important; } .heading.block_header_1 p, .heading.block_header_1 .h:last-child { font-size: 2.5rem; } .heading.block_header_1 .h { font-size: 1.5rem; } } /*--*/ section[style*="color"] .heading.block_header_1 .h:last-child, div[style*="color"] .heading.block_header_1 .h:last-child, section[style*="color"] .heading.block_header_1 p, div[style*="color"] .heading.block_header_1 p, section[style*="color"] .heading.block_header_2 .h, div[style*="color"] .heading.block_header_2 .h, section[style*="color"] .heading.block_header_3 .h, div[style*="color"] .heading.block_header_3 .h, section[style*="color"] .heading.block_header_4 .h, div[style*="color"] .heading.block_header_4 .h, section[style*="color"] .heading.block_header_5 .h, div[style*="color"] .heading.block_header_5 .h { color: inherit; } /*--*/ .heading.block_header_2 { color: #ffffff; margin-bottom: 30px; } .heading.block_header_2 .h { display: inline-block; font-weight: bold; font-size: 2.1rem; line-height: 1.5; padding-left: 34px; position: relative; } .heading.block_header_2 .h:before, .heading.block_header_2 .h:after { display: block; content: ''; position: absolute; } .heading.block_header_2 .h:before { top: 8px !important; left: 5px; width: 12px; height: 12px; border: 1px solid #53493f; } .heading.block_header_2 .h:after { top: 13px; left: 13px; width: 10px; height: 10px; border: 1px solid #998774; } .heading.block_header_2 p { font-size: 1.4rem; padding-left: 34px; } @media screen and (max-width: 800px) { .heading.block_header_2 { margin-bottom: 20px; } .heading.block_header_2 .h { font-size: 2.0rem; } .heading.block_header_2 p { font-size: 1.3rem; } } /*--*/ .heading.block_header_3 { overflow: hidden; background: #53493f; color: #fff; padding: 10px 10px 10px 30px; margin-bottom: 30px; } .heading.block_header_3 .h { font-weight: bold; font-size: 1.9rem; line-height: 1.5; } .heading.block_header_3 p { font-size: 1.4rem; } @media screen and (max-width: 800px) { .heading.block_header_3 { padding: 5px 5px 5px 30px; margin-bottom: 20px; } .heading.block_header_3 .h { font-size: 2.0rem; } .heading.block_header_3 p { font-size: 1.3rem; } } /*--*/ .heading.block_header_4 { margin-bottom: 15px; } .heading.block_header_4:before { display: none; } .heading.block_header_4 .h { font-size: 2.0rem; font-weight: bold; line-height: 1.5; margin-bottom: 5px; } .heading.block_header_4 p { font-size: 1.4rem; } /*--*/ .heading.block_header_5 { margin-bottom: 15px; } .heading.block_header_5 .h { display: inline; font-weight: bold; font-size: 1.8rem; margin-bottom: 10px; color: #fff; } .heading.block_header_5 p { display: inline; font-size: 1.4rem; color: #fff; } .heading.block_header_5 p:before { content: " / "; } /*----------------------------背景パララックス----------------------------*/ .parallax { /* box-shadow: 0 0 5px rgba(0,0,0,0.05) inset;*/ } .parallax_img { /*opacity: 0.4;*/ } .parallax .content_wrapper:empty { /*空のパララックスの高さ(下記高さ+余白設定の上下padding)*/ height: 50px !important; } /*----------------------------ボタン----------------------------*/ .contents_btn01 a, .glossary_archive .content_wrapper .heading.block_header_2 a:after, main form .submit { color: #fff !important; background: #53493f; position: relative; display: inline-block; padding-left: 10px; padding-right: 10px; text-align: center; font-weight: 500; } .contents_btn01 a span, main form .submit span { position: relative; } .contents_btn01 a:before, main form .submit:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; content: ''; background: #403830; transform-origin: right top; transform: scale(0, 1); transition: transform .5s; } .contents_btn01 a:hover:before, main form .submit:hover:before { transform-origin: left top; transform: scale(1, 1); } main form .submit span { display: block; } .contents_btn01 a[target=_blank] span:before, .contents_btn01 a[target=_blank] span:after { border: 1px solid #fff; } main .widget_gallery01 .contents_btn01 a, main .gallery_archive .inner_item .contents_btn01 a, main .gallery_single .inner_item .contents_btn01 a, main * .contents_btn01 a { overflow: visible; margin-bottom: 10px; } main form .submit { position: relative; padding: 0 !important; } main form .submit span input { font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif; font-size: 1.5rem; color: #fff; font-weight: 500; } #fixbtn .inner > div { padding: 8px 15px!important; } input[id="form_submit"], input[type="submit"], textarea { -webkit-appearance: none; border-radius: 0; } /*----------------------------ヘアライン----------------------------*/ .contents_hr hr { width: 100%; height: 1px; border-top: 1px solid rgba(0,0,0,0.5); box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset; } /*--------------------------------MV--------------------------------*/ #mv_outer { margin-left: auto; margin-right: auto; padding-top: 10px; } #mv:after { background: rgba(0, 0, 0, 0.3); } #mv { min-height: 370px; position: relative; } #mv .mv_img { margin-right: auto; margin-left: auto; width: 90%; height: 60vh; } #mv .mv_text { width: 100%; height: 100%; bottom: 0px; left: 0!important; top: 0; align-items: center; color: #fff; } #mv .mv_text > div { width: 85%; box-sizing: border-box; padding-top: 0 !important; } #mv .mv_text h2 { position: relative; font-size: 4rem !important; line-height: 1; letter-spacing: 2px; font-weight: 700; text-transform: uppercase; display: inline-block; } #mv .mv_text p { padding-top: 20px; font-size: 1.8rem; } #mv .mv_scroll { width: 3px; height: auto; position: absolute; left: 2.5%; bottom: 0px; } #mv .mv_scroll a { -webkit-writing-mode: vertical-lr; -ms-writing-mode: tb-lr; writing-mode: vertical-lr; font-family: 'Corbel', serif; letter-spacing: 0.12em; letter-spacing: 0.3em; font-size: 10px; position: relative; padding-bottom: 100px; height: auto; width: auto; text-indent: 0; potision: relative; transition: all .3s ease-in-out; text-align: right; color: #53493f } #mv .mv_scroll a:before { width: 1px; height: 70px; transform: none; position: absolute; bottom: 0; left: 1px; top: auto; background: #53493f; transition: all .3s ease-in-out; } #mv .mv_scroll a:after { content: ""; display: block; width: 3px; height: 35px; transform: none; position: absolute; bottom: 0; left: 0; top: auto; background: #53493f; transition: all .3s ease-in-out; } #mv .mv_scroll a:hover { padding-bottom: 80px; } #mv .mv_scroll a:hover:before { height: 50px; } #mv .mv_scroll a:hover:after { height: 25px; } #mv .mv_pointer { text-align: center; bottom: 10px !important; } #mv .mv_pointer li:before { background: rgba(255, 255, 255, 0.3); height: 1px; } #mv .mv_pointer li.current:before { background: rgba(255, 255, 255, 0.5); } #mv .mv_arrow { display: none !important; } @media screen and (max-width: 100vh) { #mv, #mv .mv_img, #mv_outer:after { height: 65vh; } } @media screen and (max-width: 900px) { #mv { margin-top: 0; } #mv .mv_text p { padding-top: 10px; font-size: 1.3rem !important; } #mv .mv_text h2 { font-size: 2rem !important; } } @media screen and (max-width: 650px) { #mv .mv_scroll { display: none !important; } #mv .mv_text p { display: none !important; } #mv .mv_text > div { width: 95% !important; } } /*--------------------------------IV--------------------------------*/ #lv_outer { position: relative; z-index: 1; padding-top: 10px; } #lv { height: 350px; box-shadow: none !important; width: 90%; margin-right: auto; margin-left: auto; background: #fff; } #lv div { opacity: 1; background-image: url("/common/upload_data/bar-clochettecom/image/lv.jpg"); /*デフォルトLV画像*/ /*ボカシ*/ -webkit-filter: blur(5px) brightness(60%); -moz-filter: blur(5px) brightness(60%); -o-filter: blur(5px) brightness(60%); -ms-filter: blur(5px) brightness(60%); filter: blur(5px) brightness(60%); margin-top: 200px; } _:-ms-lang(x), #lv {/* IE10+ Edge+ */ filter: blur(0); background-color: #333; } _:-ms-lang(x), #lv div {/* IE10+ Edge+ */ opacity: 0.4; } _:-ms-lang(x), #lv div.parallax_img { } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, #lv div.parallax_img { transform: translateY(-100%) !important; /* IE11 にのみ適用される */ } } #lv p { left: 0; text-align: center; width: 100%; box-sizing: border-box; z-index: 3; } #lv p span { display: inline-block; font-size: 4.0rem; text-align: center; letter-spacing: 0.2rem; padding: 0 15px; position: relative; word-break: break-all; line-height: 1.2; color: #fff; font-weight: bold; } @media screen and (max-width:900px) { #lv { height: 220px; margin-top: 0; } #lv p span { font-size: 2.8rem !important; } } @media screen and (max-width: 400px) { #lv { height: 200px; } } /*----------------------------パンくず----------------------------*/ #pan { /* border-bottom: 1px solid rgba(0,0,0,0.13);*/ /* background: #f7f5f5;*/ padding: 0; } #pan ul li { font-size: 1.2rem; padding: 5px 0 3px 30px; } #pan ul li:before, #pan ul li:after { height: 6px; width: 6px; top: calc(50% - 3px); left: 10px; border-top: 1px solid #fff; border-right: 1px solid #fff; } /*----------------------------other parts----------------------------*/ /*--リスト--*/ .default_ul li:before { border-top: 1px solid #53493f; border-right: 1px solid #53493f; height: 5px; width: 5px; transform: rotate(45deg); top: 8px; left: 0; } /*--アーカイブページ カテゴリー--*/ .category1 li a:hover, .category1 li a.current { color: #fff; background: #998774; border: 1px solid #998774; } .category1 li a { border: 1px solid rgba(255, 255, 255, 0.5); color: rgba(255, 255, 255, 0.5); } /*--sidebar--*/ /*#sidebar section, #sidebar>div{ border-bottom: 1px solid #ccc; } */ #sidebar section, #sidebar>div { border-bottom: 1px solid #333; } #sidebar .sidebar_tag li { border: 1px solid #333; background: rgba(0,0,0,0.03); } #sidebar .sidebar_list a { position: relative; padding-left: 15px; } #sidebar .sidebar_list a:before { content: ""; display: block; position: absolute; border-top: 1px solid #998774; border-right: 1px solid #998774; height: 5px; width: 5px; transform: rotate(45deg); top: calc(50% - 3px); left: 0; } .siidenav li { border-bottom: 1px solid #333; } /*----------------------------pager----------------------------*/ /*アーカイブページページャー*/ .pager li:not(.arrow) a:hover, .pager li:not(.arrow).current a { background: #998774; border: 1px solid #998774; } .pager li a { height: 45px; width: 45px; border: 1px solid rgba(255, 255, 255, 0.5); line-height: 45px; border-radius: 50px; } /*----------------------------pager2----------------------------*/ /*シングルページページャー*/ .pager2 li a { border: 1px solid rgba(255, 255, 255, 0.5); line-height: 45px; padding: 0 15px; border-radius: 50px; } .pager2 li a:hover { background: #998774; border: 1px solid #998774; } /*----------------------------popup----------------------------*/ /*画像ポップアップ拡大表示*/ .popup { background: rgba(0,0,0,0.7); } .popclose { font-size: 5rem; font-weight: normal; color: #998774;/*text-shadow: 1px 1px 1px rgba(0,0,0,0.13);*/ } .popimg { background-color: rgba(0,0,0,0.7); } .popimg img { background: #fff; max-height: 90vh; box-shadow: 10px 10px 20px rgba(0,0,0,0.20); } .poptxt { font-size: 1.2rem; background: rgba(0,0,0,0.6); } .poptxt:empty { opacity: 0 !important; } .popnav li { background: #998774; } .popnav li:before { border-top: 3px solid #333; border-right: 3px solid #333; } /*----------------------------footer----------------------------*/ #fixbtn { margin-bottom: 30px; font-size: 1.55rem; } #fixbtn .inner>div { padding: 8px 12px; } #fixbtn .fixbtnwrap { background: rgba(23,23,23,0.9); } /*▼ TEL、予約ボタンない = 追従フッター有効でない場合*/ #fixbtn.no .fixbtnwrap { background-color: transparent; } #fixbtn .fixbtntel, #fixbtn .fixbtntel a, #fixbtn .fixbtntel span { } #fixbtn .fixbtntel { border-right: 1px solid rgba(0,0,0,0.1); } #fixbtn .fixbtntel:nth-last-of-type(2) { border-right: none; } #fixbtn .fixbtntel a, #fixbtn .fixbtntel span { font-size: 3.4rem; line-height: 1; margin-right: 10px; } #fixbtn .fixbtntel a:last-child, #fixbtn .fixbtntel span:last-child { margin-right: 0; } #fixbtn .fixbtntel svg { width: 22px; height: 22px; margin-right: 5px; fill: #fff; } #fixbtn .contents_btn01 { border-left: 1px solid rgba(255,255,255,0.1); } #fixbtn .contents_btn01:nth-of-type(1) { border-left: none; } #fixbtn .contents_btn01:nth-of-type(1) { /*▼ TELない場合中央揃え*/ margin-left: auto; margin-right: auto; } #fixbtn .contents_btn01 a { /*background: #000;*/ } #fixbtn .contents_btn01 a:hover { /*background: #000;*/ } #fixbtn .contents_btn01 span { text-align: center; padding: 7px 18px; } /*▼ TEL、予約ボタンない = 追従フッター有効でない場合*/ #fixbtn #scrolltop:nth-of-type(1) { margin-left: auto; /*▼ 右揃え*/ margin-right: 0; /*▼ 中央揃え*/ margin-right: auto; } #fixbtn #scrolltop a { height: 40px; width: 40px; } #fixbtn #scrolltop a:before { top: 17px; left: 3px; transform: rotate(45deg); transition: 0.2s ease-in-out; border-left: 1px solid rgb(255,255,255); border-top: 1px solid rgb(255,255,255); width: 30px; height: 30px; } #fixbtn #scrolltop a:hover:before { border-left: 1px solid rgba(255,255,255,0.5); border-top: 1px solid rgba(255,255,255,0.5); } /*▼ TEL、予約ボタンない = 追従フッター有効でない場合*/ #fixbtn.no #scrolltop a:before { border-color: rgba(120,120,120,0.6); } #fixbtn.no #scrolltop a:hover:before { border-left: 2px solid rgba(120,120,120,1); border-top: 2px solid rgba(120,120,120,1); } @media screen and (max-width: 600px) { #fixbtn { margin-bottom: 0; border-bottom: none; } #fixbtn, #fixbtn .fixbtntel a, #fixbtn .fixbtntel span { font-size: 1.7rem; color: #fff !important; } #fixbtn .fixbtntel a, #fixbtn .fixbtntel span { font-size: 2rem; } #fixbtn .fixbtntel svg { width: 18px; height: 18px; } #fixbtn .contents_btn01 span { padding: 5px 8px; } #fixbtn .inner>div { padding: 8px 0px; } } footer { background: #000; padding: 0; text-align: center; font-size: 1.35rem; position: relative; z-index: 10; } footer a { color: #333; } footer nav li { letter-spacing: 0.2rem; padding: 5px 0; } footer nav li a { color: #fff; } footer .logo { width: 200px; margin: 0 auto 20px; } footer .sns { margin: 0 auto 30px; } footer .sns svg { width: 40px; height: 40px; padding: 10px 10px; fill: #fff; transition: 0.2s ease-in-out; } footer .sns a:hover svg { opacity: 0.8; } #cp { border-top: 1px solid rgba(0,0,0,0.9); box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset; padding: 15px 0; font-size: 1.1rem; letter-spacing: 0.1rem; color: #fff; } @media screen and (max-width: 600px) { footer { padding: 0 0 20px; } footer .logo { max-width: 150px; } } @media screen and (max-width: 600px) { /*footer nav ul{ border-bottom: 1px solid rgba(255,255,255,0.13); }*/ footer nav ul li { border-top: 1px solid rgba(255,255,255,0.1); } footer nav ul li:nth-last-of-type(2n) { border-right: 1px solid rgba(0,0,0,0.1); } footer nav ul li:nth-last-of-type(2n+1) { border-left: 1px solid rgba(255,255,255,0.1); } footer nav ul li:nth-of-type(1), footer nav ul li:nth-of-type(1), footer nav ul li:nth-of-type(2), footer nav ul li:nth-of-type(3):nth-last-of-type(2n-1) { border-top: 1px solid rgba(255,255,255,0.13); } footer nav ul li:nth-last-of-type(1), footer nav ul li:nth-last-of-type(2) { border-bottom: 1px solid rgba(255,255,255,0.1); } #fixbtn .inner > div.fixbtntel { padding-left: 3px !important; } #fixbtn .contents_btn01 a { padding: 0 !important; } #fixbtn .inner > div.contents_btn01 { padding: 8px 0 !important; } #fixbtn { margin-bottom: 0px; } #fixbtn .contents_btn01 span { padding: 5px 10px; } } @media screen and (max-width: 400px) { #fixbtn .inner > div.fixbtntel { padding: 0 !important; } #fixbtn .contents_btn01 span { font-size: 1.3rem !important; letter-spacing: 0.02rem; } } /*----------------------------tooltip--------------------------------*/ .tip { background: #998774; color: #222; box-shadow: 0 10px 20px rgba(0,0,0,0.2); } .tip span { background: #998774; } /*------------------------------------------------------------------*/ /*----------------------------widget--------------------------------*/ /*------------------------------------------------------------------*/ /*----------------------------beforeafter_archive----------------------------*/ .beforeafter_archive .wrapper_item:after { width: 1px; height: 100%; left: calc(50% - 0.5px); top: 0; background: #555; } .beforeafter_archive article:nth-of-type(n+3) { border-top: 1px solid #555; } .beforeafter_archive .before:before { height: 10px; width: 10px; transform: rotate(-45deg); border-top: 2px solid #998774; border-left: 2px solid #998774; top: calc(50% - 5px); left: calc(-10% - 3px); } /*----------------------------contents_faq01----------------------------*/ .contents_faq01 dl { border-bottom: 1px solid rgba(255,255,255,0.1); } .contents_faq01 dl:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.1); } .contents_faq01 dt { padding-left: 5rem; margin-bottom: 25px; } .contents_faq01 dd { padding-left: 7.3rem; margin-bottom: 25px; } .contents_faq01 dt:before, .contents_faq01 dd:before { width: 4rem; height: 4rem; font-size: 3rem; line-height: 1.1; text-align: center; box-sizing: border-box; font-weight: bold; color: #53493f; /*border: 1px solid #333;*/ outline-offset: -3px; } .contents_faq01 dd:before { color: #998774; } @media screen and (max-width: 900px) { .contents_faq01 dd { margin-bottom: 0px !important; } } @media screen and (max-width: 500px) { .contents_faq01 dt { margin-bottom: 0px; } } /*----------------------------contents_related----------------------------*/ .contents_related .inner_item { border: 1px solid rgba(255,255,255,0.13); } .contents_related .inner_item a:hover { background: #333; } .contents_related .inner_item_img { background-color: rgba(255,255,255,0.1); } /*----------------------------contents_related_tags----------------------------*/ .contents_related_tags .inner_item { border: 1px solid rgba(255,255,255,0.13); } .contents_related_tags .inner_item a:hover { background: #333; } /*----------------------------block_table_1----------------------------*/ .block_table_1 table thead { background: rgba(255,255,255,0.05); } .block_table_1 table thead th, .block_table_1 table thead td { background-color: rgba(255,255,255,0.05); } .block_table_1 table th { background-color: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.13); text-align: center; vertical-align: middle; } .block_table_1 table td { background-color: transparent; border: 1px solid rgba(255,255,255,0.13); vertical-align: middle; } .block_table_1 table thead td { text-align: center; font-weight: bold; } /*----------------------------block_table_2,5,6----------------------------*/ .block_table_2 table thead, .block_table_2 table thead th, .block_table_2 table thead td, .block_table_5 table thead, .block_table_5 table thead th, .block_table_5 table thead td, .block_table_6 table thead, .block_table_6 table thead th, .block_table_6 table thead td { background-color: rgba(255,255,255,0.05); } .block_table_2 table th, .block_table_5 table th, .block_table_6 table th { background-color: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.13); text-align: center; vertical-align: middle; } .block_table_2 table td, .block_table_5 table td, .block_table_6 table td { background-color: transparent; border: 1px solid rgba(255,255,255,0.13); vertical-align: middle; } .block_table_2 table thead td, .block_table_5 table thead td, .block_table_6 table thead td { text-align: center; font-weight: bold; } @media screen and (max-width: 500px) { .block_table_2 table { border-bottom: 1px solid rgba(255,255,255,0.13); } .block_table_2 table th { border-top: 1px solid rgba(255,255,255,0.13); background-color: rgba(255,255,255,0.05); } .block_table_2 table td { border-top: 1px dotted rgba(255,255,255,0.13); } } /*----------------------------block_table_3,7----------------------------*/ .block_table_3 table th, .block_table_7 table th { background-color: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.13); text-align: center; vertical-align: middle; } .block_table_3 table td, .block_table_7 table td { background-color: transparent; border: 1px solid rgba(255,255,255,0.13); vertical-align: middle; } @media screen and (max-width: 500px) { .block_table_3 table { border-bottom: 1px solid rgba(255,255,255,0.13); } .block_table_3 table th { border-top: 1px solid rgba(255,255,255,0.13); } .block_table_3 table td { border-top: 1px dotted rgba(255,255,255,0.13); } } .block_table_3_item li { vertical-align: middle; } /*----------------------------gallery_archive / gallery_single----------------------------*/ .gallery_archive .inner_item a, .gallery_single .inner_item a { transition: 0.2s ease-in-out; background-color: transparent; } .gallery_archive .inner_item a:hover, .gallery_single .inner_item a:hover { background-color: #fff; } .gallery_archive .inner_item a:hover img, .gallery_single .inner_item a:hover img { opacity: 0.8; } .gallery_archive .inner_item a:after, .gallery_single .inner_item a:after { color: #fff; } .gallery_archive .inner_item p span, .gallery_single .inner_item p span { color: #f8f8f8; } /*----------------------------widget_gallery01----------------------------*/ .widget_gallery01 .slick-arrow { height: 40px; width: 30px; top: calc(50% - 20px); left: 0; } .widget_gallery01 .slick-next { left: auto; right: 0; } .widget_gallery01 .slick-arrow:before { width: 15px; height: 15px; top: calc(50% - 7px); border-top: 1px solid #998774; border-left: 1px solid #998774; } .widget_gallery01 .slick-prev:before { transform: rotate(-45deg); left: calc(50% - 4px); } .widget_gallery01 .slick-next:before { transform: rotate(135deg); left: calc(50% - 12px); } /*----------------------------gallery hover効果----------------------------*/ main .widget_gallery01 .contents_btn01 a { overflow: visible!important; } main .widget_gallery01 a, main .gallery_archive .inner_item a, main .gallery_single .inner_item a { overflow: hidden; } main .widget_gallery01 a, main .gallery_archive .inner_item a { } main .widget_gallery01 a img, main .gallery_archive .inner_item a img, main .gallery_single .inner_item a img { /*▼ 位置調整 美容院などの人物の場合は50% 30%あたり*/ object-fit: cover; object-position: 50% 50%; font-family: 'object-fit: cover; object-position: 50% 50%;'; backface-visibility: visible; transition: 1s ease-out !important; transition-property: transform opacity !important; transform: scale(1.001, 1.001); } main .widget_gallery01 a:hover img, main .gallery_archive .inner_item a:hover img, main .gallery_single .inner_item a:hover img { transform: scale(1.1, 1.1); opacity: 0.8; } /*----------------------------news_archive----------------------------*/ .news_archive article { border-bottom: 1px solid #333; } .news_archive article .inner_item_img:hover { opacity: 0.8; } .news_archive article .entry_meta { font-size: 1.3rem; } /*----------------------------widget_coupon----------------------------*/ .widget_coupon .content_wrapper { max-width: 900px !important; } .widget_coupon .inner_item { border: 5px solid #333; } .widget_coupon .inner_item h3 { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_coupon .inner_item>div { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_coupon .inner_item>div, .widget_coupon .inner_item>dl { font-size: 1.4rem; line-height: 1.7; } .widget_coupon .coupon_limit { background: #333; } /*----------------------------widget_form----------------------------*/ .widget_form .privacypolicy { border: 1px solid #555; } .widget_form form { border-top: 1px solid #555; } .widget_form form dl { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_form form dt, .widget_form form dd { vertical-align: middle; } .widget_form form dt span { color: #9a0b17; font-size: 1.2rem; font-weight: bold; } .widget_form form .submit { margin-top: 15px; } @media screen and (max-width: 770px) { .widget_form form dt { border-bottom: 1px dotted rgba(255,255,255,0.13); } } main form dl input, main form textarea { background: #333; border: 1px solid transparent; letter-spacing: 1px; } main form dl input:focus, main form textarea:focus { background: #666; color: #fff; border: 0px solid rgba(255,255,255,0.13); } main form .submit input { letter-spacing: 3px; border: none; } main form select { background: #fff; border: 1px solid #ccc; letter-spacing: 1px; } main form input[type=radio] + label, main form input[type=checkbox] + label { padding: 0 15px 0 22px; } main form input[type=radio] + label::before, main form input[type=checkbox] + label::before { top: 50%; left: 0; width: 17px; height: 17px; margin-top: -9px; background: #333; } main form input[type=radio] + label::before { background: #333; border-radius: 30px; border: 1px solid #333 !important; } main form input[type=checkbox] + label::before { background: #333; border: 1px solid #333 !important; } main form input[type=radio]:checked + label::after, main form input[type=checkbox]:checked + label::after { left: 4px; width: 9px; height: 9px; margin-top: -5px; background: #998774; } main form input[type=radio]:checked + label::after { border-radius: 100%; } main form input[type=checkbox]:checked + label::after { } /*----------------------------widget_link----------------------------*/ .widget_link .inner_item_txt { font-size: 2rem; } .widget_link .inner_item_url { color: #998774; } /*-.block_link_1-*/ .widget_link.block_link_1 .wrapper_item a:hover { background: #333; } /*----------------------------widget_lp01----------------------------*/ .widget_lp01 li { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_lp01 li:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.13); } .widget_lp01 li a:hover { opacity: 0.8; } .widget_lp01 li a #div span { background: #eae5e5; background-size: 60% auto; } .widget_lp01 li p:nth-of-type(1):before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 3px); left: 20px; } /*----------------------------widget_lp02----------------------------*/ .widget_lp02 li { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_lp02 li:nth-of-type(-n+2) { border-top: 1px solid rgba(255,255,255,0.13); } .widget_lp02 li a div span { background: #eae5e5; } .widget_lp02 li p:nth-of-type(1):before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 3px); left: 20px; } /*----------------------------widget_menu01----------------------------*/ .widget_menu01 h3 { vertical-align: central; font-size: 1.7rem; letter-spacing: 1px; margin-bottom: 15px; } .widget_menu01 li { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_menu01 li:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.13); } .widget_menu01 li dt:before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 4px); left: 0; } .widget_menu01 li dd { font-size: 1.3rem; letter-spacing: 0; } /*----------------------------widget_menu02----------------------------*/ .widget_menu02 h3 { vertical-align: central; font-size: 1.7rem; letter-spacing: 1px; } .widget_menu02 li { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_menu02 li:nth-of-type(1), .widget_menu02 li:nth-of-type(2) { border-top: 1px solid rgba(255,255,255,0.13); } .widget_menu02 li dt:before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 4px); left: 0; } .widget_menu02 li>p { font-size: 1.3rem; letter-spacing: 0; } @media screen and (max-width: 800px) { .widget_menu02 li { border-bottom: 1px solid rgba(255,255,255,0.13); } } /*----------------------------widget_news01----------------------------*/ .block_news_1 li { border-bottom: 1px solid rgba(255,255,255,0.13); } .block_news_1 li:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.13); } .block_news_1 li p:nth-of-type(1):before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 3px); left: 5px; } @media screen and (max-width: 500px) { .block_news_1 li:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.13); } } /*----------------------------widget_news02----------------------------*/ .block_news_2 li { background: #000!important; } .block_news_2 li:nth-child(2n) { background: #202020!important; } .block_news_2 li a { padding: 30px; } .block_news_2 ul li a { color: #fff !important; } .block_news_2 li a:after { border: 0 solid #2b2927; transition: 0.2s ease-in-out; } .block_news_2 li a:hover:after { border-width: 10px; } .block_news_2 li a div span { background: #f0f0f0; } .block_news_2 li p:nth-of-type(1):before, .widget_news02 li p:nth-of-type(1):before { height: 5px; width: 5px; border-top: 1px solid #998774; border-right: 1px solid #998774; transform: rotate(45deg); top: calc(50% - 3px); left: 0; } #sidebar .widget_news02 li a div span { background-color: rgba(255,255,255,0.1); } /*----------------------------widget_shop01----------------------------*/ .widget_shop01 dl { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_shop01 dl:nth-of-type(1) { border-top: 1px solid rgba(255,255,255,0.13); } @media screen and (max-width: 700px) { .widget_shop01 dt { border-bottom: 1px dotted rgba(255,255,255,0.13); font-weight: bold; } .inner .fixbtntel a { padding-right: 6px; } } /*----------------------------widget_sitemap----------------------------*/ .widget_sitemap li { border-bottom: 1px solid rgba(255,255,255,0.13); } .widget_sitemap .content_wrapper>ul { border-top: 1px solid rgba(255,255,255,0.13); } .widget_sitemap .content_wrapper>ul>li>a:after { height: 4px; width: 4px; top: calc(50% - 4px); left: 0.9rem; box-sizing: border-box; border: 4px solid transparent; border-left: 4px solid #998774; } .widget_sitemap ul ul { border-top: 1px dotted rgba(255,255,255,0.13); } .widget_sitemap ul ul li { border-bottom: 1px dotted rgba(255,255,255,0.13); } .widget_sitemap .content_wrapper>ul>li li>a:after { width: 4px; top: calc(50% - 1px); left: 3px; border-top: 1px solid #998774; } .widget_sitemap .content_wrapper > ul > li > a { padding-left: 25px !important; } /*----------------------------widget_staff01----------------------------*/ .widget_staff01 .inner_item a:hover * { opacity: 0.8; } .widget_staff01 .inner_item_img { border: 1px solid #555; } .widget_staff01 .sub { font-size: 1.2rem; font-weight: bold; } .widget_staff01 .contents_btn01 { border-top: 1px solid rgba(255,255,255,0.13); } /*----------------------------widget_tel----------------------------*/ .widget_tel .inner_item_txt { border: 1px solid #998774; } .widget_tel .inner_item_tel { border: 1px solid #998774; } .widget_tel .inner_item_tel a, .widget_tel .inner_item_tel span { font-size: 3.6rem; letter-spacing: 0.1rem; line-height: 1.1; color: #fff; padding: 20px; background: #998774; } .widget_tel .inner_item_tel a:hover { background: #998774; color: #fff; } .widget_tel .inner_item_tel svg { height: 22px; width: 22px; margin: 1px 5px 0 0; fill: #fff; transition: 0.2s ease-in-out; } .widget_tel .inner_item_tel a:hover svg { fill: #fff; } @media screen and (max-width: 450px) { .widget_tel .inner_item_tel a, .widget_tel .inner_item_tel span { font-size: 2.6rem; padding: 15px 10px; } .widget_tel .inner_item_tel img { margin: 0 5px -2px 0; } .widget_tel .inner_item_tel svg { height: 16px; width: 16px; } } /*------------------glossary_archive------------------------*/ .glossary_archive article { border-bottom: 1px solid #555; } .glossary_archive article .inner_item_img:hover { opacity: 0.8; } .glossary_archive .content_wrapper article { margin-bottom: 30px; padding-bottom: 30px;/*★1*/ } .glossary_archive .content_wrapper .heading.block_header_2 { margin-bottom: 10px; padding-bottom: 0em; position: relative } .glossary_archive .content_wrapper .heading.block_header_2 .h { font-size: 1.8rem; } .glossary_archive .content_wrapper .heading.block_header_2 a:after { content: "もっと見る"; position: absolute; width: 150px; bottom: -40px;/*★1 + 数px*/ right: 0; text-align: center; font-size: 1.3rem; font-weight: 500; padding: 5px 10px; } .glossary_archive .content_wrapper .heading.block_header_2 a:hover:after{ opacity: 0.8; } .glossary_archive .content_wrapper .heading.block_header_2 .h::before { top: 5px !important; } .glossary_archive .content_wrapper article .entry_body { padding-right: 180px; padding-left: 1.5em; } @media screen and (max-width: 650px) { .glossary_archive .content_wrapper .heading.block_header_2 .h:before { top: calc(50% - .3rem) !important; } .glossary_archive .content_wrapper .heading.block_header_2 .h:after { top: calc(50% + .5rem) !important; } .glossary_archive .content_wrapper .heading.block_header_2 { padding-top: 15px; } .glossary_archive .content_wrapper article { padding-bottom: 60px; } .glossary_archive .content_wrapper .heading.block_header_2 a:after { bottom: 10px;/*★1*/ } .glossary_archive .content_wrapper article .entry_body { padding-right: 0; } } /*------------------contents_related p------------------------*/ .contents_related p{ padding-top: 0 !important; }