@charset "utf-8";
/*
Theme Name: lightning-child
Theme URI:
Template: lightning
Description:
Author: le-mina-rie with MarkleDesign
Tags:
Version: 0.1.2
*/
/*トップページスライダー ページネーションアイコンを非表示 24/5/3 追記*
.swiper-pagination {
display:none!important;
}*/
/**************************************
WEBフォント指定
*************************************/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;500&display=swap');
*{
font-family: 'Noto Sans JP', sans-serif;
}
p , body{
/* font-family: kozuka-gothic-pro, sans-serif;
font-family: '小塚ゴシック Pro','Kozuka Gothic Pro',sans-serif;
font-family: 'Noto Sans JP', sans-serif;
font-optical-sizing: auto;
font-weight: <weight>;
font-style: normal;
font-family: 'Noto Sans JP', sans-serif;*/
font-weight:300;
font-size:14px;
letter-spacing :0.1em;
line-height:1.8em;
text-align: justify;
/* color:#333333 !important;*/
color:#202020 !important;
}
.just{
text-align: justify;
}
/*.entry-body {
font-size:1em;
font-weight:200 !important;
}
/*日付ピッカー*/
.ui-datepicker-year , .ui-datepicker-month{
margin:0!important;
padding:0!important;
font-size:8 !important;
}
/*グローバルナビ 文字太さ*/
.global-nav-list>li .global-nav-name{
font-weight:400 !important;
}
.pt-cv-title{
font-size:0.8em !important;
font-weight:100 !important;
}
.pt-cv-wrapper img:hover {
opacity: 0.7 !important;
}
/* サブメニューの色 */
.sub-menu .acc-child-close{
background-color:yellow !important;
}
.acc-btn .acc-btn-open{
display:none !!important;
}
/***********************************************
スクロール時のヘッダーロゴを表示
***********************************************/
@media (min-width: 750px) {
.header_scrolled .site-header-logo {
display: block;
position: absolute;
padding: 10px;
}
.site-header--layout--nav-float .site-header-logo {
margin-right: 0;
width: auto;
}
.header_scrolled .site-header-logo img {
width: auto;
height: 30px;
}
.header_scrolled .site-header .global-nav {
margin-right: 0;
}
}
/**************************************
フロートバナー（PC)
**************************************/
/* フローティングバナーのラップ要素 */
#fixed_right_banner{
position: fixed;
top: 220px;
right: -5px ;
z-index: 9999;
}
/* 画像の共通設定 */
#fixed_right_banner > * {
width: 55px;
}
/* 2個目以降の画像の上部に余白を作る */
#fixed_right_banner > * ~ * { margin-top: -3px; }
/* リンク要素 */
#fixed_right_banner > a {
display: block; /* ブロック要素に変更 */
}
/*************************************************
モバイルフッターバナー (モバイル)
***************************************************/
/*フロートバナーでのみ利用 スマホで表示する*/
@media (max-width: 599px) {.only_pc {display:none}} /*スマホでのみ表示する （only_pc クラスを非表示）*/
/*PCで表示する*/
@media (min-width: 600px) {.only_mb {display:none}} /*PCでのみ表示する （only_mb クラスを非表示）*/
.wrap{
display: block;
position: fixed;
left: 0px;
right: 0px;
bottom: -3px;
/* height:75px;*/
z-index: 9999;
}
.inner-1{
float: left;
width: 100%;
margin-left : 0;
}
/*
.inner-2{
float: left;
width: 50%;
margin-left : 0;
}
/*
.su-spacer{
border:none !inportant;
}
*/
/**************************************
Hタグの装飾を変更
**************************************/
/*.entry-title--post-type--page, h2 {*/
h2 {
padding: 0.5em 0;
/* border-top: 2px solid var(--vk-color-primary);*/
border-top: none;
border-bottom: none;
margin-bottom: 0;
}
/*.site-footer-title, h3 {*/
.site-footer-title,{
position: static;
border-bottom:none;
background: 0 0;
padding: 0 0 0.5em;
}
.title_font{
font-weight:200 !important;
font-size:1.3em;
}
.mb-logo{
font-weight:200 !important;
font-size:1.1em;
}
/*トップページ ギャラリーのキャプションの修正*/
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
background: none;
margin-top:1.5em;
bottom: 0;
color: #000;
}
/************************************************************
投稿文書
**********************************************************/
/*投稿文書のメタアイテムの非表示設定*/
.breadcrumb .fa-home,/*パンくずリストのアイコン*/
.entry-meta .fa-calendar-alt, /*作成日のカレンダーアイコン*/
.entry-meta .entry-meta-item-updated, /*更新日*/
.entry-meta .entry-meta-item-author, /*作成者*/
.next-prev,/*前後の記事へのリンク*/
.comments-area/*コメントエリア*/
{
display:none;
}
/*投稿分署 固定ページ のタイトル文字サイズを変更*/
@media (min-width: 751px){
h1.entry-title {
font-size:1.7em;
font-weight:200;
}}
@media (max-width: 750px){
h1.entry-title {
font-size:1.5em;
font-weight:300;
}}
/*投稿一覧（パンくずから開いた）ボタンの色を変更*/
.btn-primary {
background-color: var(--vk-color-primary);
border-color: var(--vk-color-primary);
}
.btn-primary:hover,
.btn-primary:focus {
color: #fff;
background-color: #dcdcdc !important;
border-color: #dcdcdc !important;
}
/*投稿一覧
.single-post .siteContent .subSection {
display:none !important;
}
.single-post .site-body-container .container{
display:none !important;
}
aside.widget {
display:none !important;
}
div.site-body{
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
}
div.site-body{
width:100%;
}
div.site-body-container{
margin-left:5%;
margin-right:5%;
}*/
/************************************************************
News 一覧
**********************************************************/
/*「新着」を消す*/
.vk_post_title_new {
display:none;
}
/*「続きを読む」 色を変更*/
.pt-cv-wrapper .btn-success {
color: #fff;
background-color: #c0c0c0;
border-color: #c0c0c0;
}
/*「続きを読む」 ホバー時に色を変更*/
.btn-success:hover,
.btn-success:focus{
color: #fff;
background-color: #dcdcdc !important;
border-color: #dcdcdc !important;
}
/*一覧表示時に見える本文の文字サイズを変更*/
.pt-cv-content, .pt-cv-content * {
font-weight: 200;
font-size:0.9em;
margin-top :0.8em;
}
/*一覧表示時の各情報ページの間隔を変更*/
.pt-cv-meta-fields{
margin-top:2em;
}
/*スマホで画像を中央に→現在効いていない*/
.pt-cv-ifield img{
text-align:center !important;
}
/************************************************************
TOP ページ（主として 24年8月 変更時）
**********************************************************/
/* ページ・トップのタイトル枠内の背景色*/
.bg-white{
background-color:#fff;
}
.bg-white-mb{
background-color:#fff;
}
/*トップスライダー下のリンク文字の位置合わせ*/
.page-id-11 .site-body{
padding:0 !important;
}
/* ラインマーカー*/
.yellow-under{
background: linear-gradient(transparent 80%, #ffe100 90%);
}
/*トップページの白い枠組の余白*/
.white-block{
padding:1.5em;
background:white;
}
.top-space{
padding:1em ;
}
.img-margin{
margin:1.3em;
}
.white-block .eng{
font-size:1.6em !important;
font-weight:500 !important;
}
.white-block .jpn{
font-size:1.1em !important;
/*color:red;*/
margin-top:0.5em;
font-weight:300;
}
.white-block .title{
font-size:2em;
letter-spacing: 0.05em;
font-weight:500;
padding:1.5em 0;
}
/*私たちについて グレーボタン*/
.gray-button {
display:inline-block;
padding:0.3em 1em;
margin:0.1em 0 1.2em;
border-radius: 5px;
background-color: #9fa0a0 !important;
color:white !important;
font-weight:500;
border-style: solid; border-color: #c0c0c0; border-width:1px !important;
}
.gray-button:hover {
background-color: #dcdcdc !important;
color:#fff;
border-style: solid; border-color: #dcdcdc; border-width:1px !important;
}
.gray-button a{
color:white !important;
}
/*背景白のブロック*/
.bg-white{
background:white;
}
/* ｈ３ アバウト、サービス（ブランディング、ロゴデザイン） 各ページの H3 黄色下線 の下余白*/
.page-id-11 h3,.page-id-3135 h3,.page-id-3204 h3,.page-id-3542 h3{
margin-bottom:0.1em !important;
}
/* 文字サイズ サービス その他*/
.eng-1{
font-size:1.6em;
font-weight:500;
}
.jpn-1{
font-size:1.1em;
font-weight:300;
}
/*サービスブロックの黄色い帯*/
.service-yellow{
background:#ffe100;
padding:0.3em 0 0.3em;
margin:0;
text-align:center;
font-weight:500 !important;
font-size:1.3em !important;
letter-spacing: 0.1em !important;
}
.page-id-3339 .service-yellow{
font-size:1.1em !important;
}
.bg-white .sub-title{
font-size:1.1em;
font-weight:500;
margin:0.6em 0;
}
.bg-white p{
margin:0.4em 1.8em 1.5em !important;
letter-spacing: 0.03em !important;
line-height:24px !important;
font-size:1em !important;
font-weight:300 !important;
}
/* feature 私たちについて*/
.fe-border{
border:1px solid #e9eaea;
}
.fe-box{
padding:1.3em 0.2em 0.5em;
}
.s-txt{
font-size:0.9em !important;
}
/* お客様の声*/
@media (max-width: 750px) {.voice-p{
padding:1.5em 5em 0;
}}
.top-voice p{
font-size:1.1em;
font-weight:200 !important;
}
/* 最下部のコンタクト（黄色）*/
.yellow-block{
padding:2em;
background:#ffe100;
}
.yellow-block h3{
font-size:1.6em !important;
font-weight:500;
}
/************************************************************
ABOUT ページ（主として 24年8月 変更時）
**********************************************************/
/* メッセージ アートディレクター・デザイナー 文字ピッチ*/
@media (max-width: 750px) {.ad{
letter-spacing: 0.02em;
}}
/*コンセプトの箇条書き部分*/
@media (min-width: 751px) {
.core{
margin-left:20em;
margin-bottom:1em;
font-size:1.1em;
}
}
@media (max-width: 750px) {
.core{
margin-left:1.7em;
margin-bottom:1em;
font-size:1.1em;
}
}
/* abaut のコンセプト内 箇条書き list クラス内の ul li */
@media (min-width: 751px) {
.list{
margin-left:20em;
margin-bottom:1em;
font-size:1.1em;
}}
@media (max-width: 750px) {.list{
margin: 0 1.5em 1em 0;
font-size:1.1em;
}}
.list ul {
list-style:none;
}
.list ul li {
text-indent:-1.5em;
padding-left:1em;
}
/*プロフィールの左右ブロック PC*/
@media (min-width: 751px) {.prof-1{
width:55%;
margin:1em 0 2em 6em;
float:left;}}
@media (min-width: 751px) {.prof-2{
width:25%;
margin:1em 1.5em;
padding-left:30px;
float:left;}}
/*プロフィールの左右ブロック スマホ*/
@media (max-width: 750px) {.prof-1{
width:60%;
float:left;}}
@media (max-width: 750px) {.prof-2{
width:25%;
padding-left:15px;
float:left;}}
/*プロフィールの氏名*/
.p-name{
font-size:1.2em;
font-weight:500;
}
/*メッセージのボックス*/
/*囲み線*/
.m-border{
border: solid 1px;
border-color:#e9eaea;
}
.m-border p{
padding:1em 1.5em;
}
/* message の文字左寄せ */
.mes-yellow{
background:#ffe100;
padding:0.3em 0 0.4em 1em;
margin:0;
text-align:left;
font-weight:500 !important;
font-size:1.3em !important;
letter-spacing: 0.15em !important;
}
.cb{
clear:both;
}
/* 武井・潮崎 の間の罫線の幅*/
hr.mes{
margin:2em 5.5em 1em ;
}
/*会社概要*/
@media (min-width: 751px) {.gaiyo-block{
margin:0 10%;
}}
@media (max-width: 750px) {.gaiyo-block{
margin:0 1em;
}}
.item-1{
width:20%;
display: inline-block;
vertical-align: top;
box-sizing: border-box;
}
@media (max-width: 750px) {.item-1{
width:28%;
}}
.item-2{
width:75%;
display: inline-block;
vertical-align: top;
box-sizing: border-box;
}
@media (max-width: 750px) {.item-2{
width:70%;
}}
.item-1 img{
margin: 0.3em 0.5em;
}
/************************************************************
SERVICE ー ブランディング ページ（主として 24年8月 変更時）
**********************************************************/
/* 本体の上部余白をゼロに。全ページ共通 */
.site-body{
padding-top:0 !important;
}
/* タイトル サービスページ共通 */
.srvc-eng{
font-size:4em;
font-weight:500;
padding-top:0 !important;
padding-bottom:0 !important;
}
.srvc-jpn{
font-size:1.2em;
font-weight:300;
}
.srvc-bg-white{
background:white;
margin-top:-5px !important;
}
/* ロゴデザイン ページのタイトル モバイル用の小さい文字サイズ*/
.srvc-eng-logo_mb{
font-size:3.3em;
font-weight:500;
padding-top:0 !important;
padding-bottom:0 !important;
}
/* ブランディングページのプロフィール 余白 */
@media (min-width: 751px) {.brd-block-1{
/* margin:2em 1em 2em 15em ;*/
margin:2em -2em 2em 26em;
}}
@media (max-width: 750px) {.brd-block-1{
margin:1em 1.5em 0;
}}
@media (min-width: 751px) {.brd-block-2{
/* margin:2em 15em 2em 1em ;*/
margin:2em 2em 2em 5em ;
}}
@media (max-width: 750px) {.brd-block-2{
margin:-1em 1.5em 0;
}}
/* ブランディングページトップのプロフィールへのリンク*/
[class|="brd-block"] a:link{
text-decoration: none !important;
}
/* ブランディングページ ページ内遷移 メニュー *
@media (min-width: 751px) {*/
.brd-menu{
text-align:center;
background:white;
margin-top:1em;
padding:0.3em;
font-size:0.9em;
letter-spacing:0.1em;
font-weight:500;
border: solid 1px;
border-color:#e9eaea;
&:hover{
/*border: solid 2px;*/
background:#dcdcdc;
}}
/*@media (max-width: 750px) {.brd-menu{
text-align:left;
background:white;
margin:-1em 0.3em -1em;
padding:0.3em;
font-size:0.8em;
letter-spacing:0.05em;
font-weight:500;
border: solid 1px;
border-color:#e9eaea;
&:hover{
/*border: solid 2px;*
background:#dcdcdc;
}}}
*/
/*.brd-menu a:hover{*/
.link-menu a:hover{
color:#202020 !important;
}
h3.world{
font-size:2.5em;
padding-bottom:0.7em;
}
/* ブランディングページのプロフィール 余白 */
.srvc-box{
background:white;
padding:3em 1.7em 1.5em;
}
.chat-box{
background:white;
padding:0em 1.7em 3em ;
}
/*目次 アバウトページの 「 .m-border 」を使う*/
/*目次背景色*/
.bg-gray{
background :#f2f2f2 ;
}
/*ブランディングページの幅 （左右マージン）*/
@media (min-width: 751px) {.brand-width{
padding:1em 13em 5em;
background:white;
}}
@media (max-width: 750px) {.brand-width{
padding:1em;
background:white;
}}
/*目次 の箇条書き*/
@media (min-width:751px){.mokuji ul {
list-style:none;
padding: 1em 3em 0.2em;
}}
@media (max-width:750px){.mokuji ul {
list-style:none;
text-align:left;
}}
.mokuji ul li {
text-indent:-0.8em;
padding-left:0.2em;
}
.mokuji a:link {
text-decoration: none !important;
color:#202020 !important;
&:hover{
color: #a0a0a0 !important;
}}
/*各事例 （id=#case-1 〜 casse-0 全てに適用するタイトル文字サイズ*/
[id^="case"] .font-m{
font-size:1.2em;
margin-bottom:0.2em;
}
/*各事例 （id=#case-1 〜 casse-0 全てに適用するタイトル画像の余白*/
[id^="case"] img{
margin:1em 0;
}
/*各事例 （id=#case-1 〜 casse-0 全てに適用する 「まとめ」 のグレー部分 */
@media (min-width:751px){.summary {
background :#f2f2f2 ;
padding: 1em 3em 1.5em;
}}
@media (max-width:750px){.summary {
background :#f2f2f2 ;
text-align:left;
padding:1.2em 1em;
}}
/*タニタ スマホ文字サイズ*/
@media(max-width:750px){.tanita{
font-size:0.9em;
letter-spacing:0.01;
}}
/*タニタ製品 提案 の箇条書き*/
#case-3 ul {
list-style:none;
}
#case-3 ul li {
text-indent:-0.8em;
padding-left:1.5em;
line-height:1.1em;
}
@media(max-width:750px){#case-3 ul li {
padding-left:1rem;
text-indent:-2rem;
padding-right:0.8rem;
line-height:1.1em;
}}
/*タニタ製品 罫線 hr の上下余白（画像の上下余白で解決）*/
@media(min-width:751px){.yohaku img{
margin:2em 0;
}}
/* 「期待できる効果」 のグレー枠の下の余白を小さく*/
.summary li:last-child , .summary ul {
margin-bottom:0;
padding-bottom:0;
}
/*コンタクト の 黄色い帯 背景色*/
.bg-yellow{
background:#ffe100;
}
/*「流れ」 以下の幅 罫線上下余白*/
.brand-width hr{
margin:1em 0;
}
.cost a:link{
color:black !important;
font-weight:500;
}
/*タニタHW 75周年のマージンボトムを小さく 「旧ブランディングページのコード
@media (min-width: 751px) {#thw.brand-width , #others .brand-width {
padding:1em 10em 2em;
background:white;
}}*/
/* ブランディングページ 各ケースでの サブタイトル ページ内共通 */
.sub-t{
font-size:1.2em;
margin-bottom:0.6em;
}
/* 「クリエイティブ領域」へのリンク 下線（破線） */
.link-ul {
text-decoration:none;
/* border-bottom:0.5px dashed ;*/
}
/* （ ）内の文字を小さく */
.brand-width .s-text{
font-size:0.9em;
letter-spacing:0.01;
}
.t-voice{
margin-bottom:-2em !important;
}
/*「others」 の罫線の余白 */
.brand-width hr.others{
margin:-1em 0 2em ;
}
/* ご検討の方 サービスページの３ページ 共通 「s-color」は、サービスページのボタン*/
.kentou{
display:inline-block;
border: solid 1px;
border-color:#e9eaea;
background:white;
padding:0.7em 2.5em;
font-weight:500;
&:hover{
background:#dcdcdc;
}}
.kentou-mb{
margin;0 20%;
border: solid 1px;
border-color:#e9eaea;
background:white;
padding:0.7em 2.5em;
font-weight:500;
&:hover{
background:#dcdcdc;
}}
.kentou a:hover,.txt-r a:hover, .txt-l a:hover, .s-color a:hover{
color:#202020 !important;
}
@media (min-width:751px){.txt-r{
text-align:right;
}}
@media (max-width:750px){.txt-r , .txt-l{
text-align:center;
margin-bottom:0.5em;
}}
@media (min-width:751px){.txt-l{
text-align:left;
}}
/************************************************************
ロゴデザイン ページ
**********************************************************/
#type-of-logo img{
margin:2em 0 0;
}
su-row {
margin-bottom: 0;
padding-bottom: 0;
}
/*.similar{
margin-left:4em;
}*/
.va{
vertical-align : center;
}
#award-list img {
padding :0.2em;
border : solid 1px #dcdcdc;
/*border : solid 1px #dcdcdc;*/
}
.white-border img{
border : none !important;
}
/* アワードの画像リスト下の脚注文字サイズ*/
.awd-txt{
font-size:0.95em;
text-align:left !important;
letter-spacing:0;
}
/* アワードブロック モバイル用２列表示 float left*/
/* トップページの bg-white クラス を利用。 p のみ変更*/
@media(min-width:751px){.trademark-box {
background : white;
/*margin-top:2em;*/
margin : 2em 0 1.5em;
padding :2em 2em 2em 5em !important;
border : solid 1px #dcdcdc;
display:inline-block;
}}
@media(max-width:750px){.trademark-box{
background : white;
/*margin-top:2em;*/
margin : 2em 0 1.5em;
padding :0.8em; !important;
border : solid 1px #dcdcdc;
display:inline-block;
}}
/*#trademark-box .su-column .su-column-size-2-5{
margin-left:0% !important;
}
.trademark-box p{
margin:0;
padding:0;
}*/
@media(min-width:751px){.simi-left-1{
float:left;
width: 70%;
box-sizing:border-box;
margin-right :0;
padding-right :0;
}}
@media(min-width:751px){.simi-left-2{
float:left;
width: 30%;
box-sizing:border-box;
margin-left :0;
padding-left :0;
}}
@media(max-width:750px){.simi-left-1{
padding:0.8em;
}}
@media(max-width:750px){.simi-left-2{
text-align:center;
}}
/************************************************************
フッター SNSアイコン
**********************************************************/
.sns-icon {
margin:0 30%;
display:grid;
grid-template-columns:15% 7% 7% 7%;
width:100%;
}
@media(max-width:750px){.sns-icon {
margin:0 10%;
grid-template-columns:20% 20% 20% 20%;
}}
.footer-icon {
margin:5px;
align-items: center;
justify-content: center;
display: flex;
}
.fotter-link {
margin:-2em 0 0 5%;
display:grid;
grid-template-columns:20% 30% 20% 20%;
width:100%;
}
/* コンタクトフォーム で、フッター非表示*/
.page-id-13 .site-body-bottom,.page-id-994 .site-body-bottom,.page-id-996 .site-body-bottom{
display:none !important;
}
/************************************************************
works ページ
**********************************************************/
/*タブの色
.su-tabs{
background:#f8f8f8;
border:none !important;
}
.su-tabs-nav{
background-color:#f8f8f8;
border:none;
}
.su-tabs-panes {
border:none !important;
background: #f8f8f8;
}*/
.l-space{
line-height : 2em;
}
/************************************************************
about ページ と Works ページ（顔写真とお客様の声を併記している部分）
**********************************************************/
/*'23/10/28 追加 プロフィール部分と会社ロゴ*/
@media (min-width: 751px) {.prof-width{margin-left: 35%;}}
@media (min-width: 751px) {.prof-fl-1{
width:15%;
float:left;}}
@media (min-width: 751px) {.prof-fl-2{
width:80%;
padding-left:30px;
float:left;}}
@media (max-width: 750px) {.prof-fl-1{
width:30%;
float:left;}}
@media (max-width: 750px) {.prof-fl-2{
width:68%;
padding-left:20px;
float:left;}}
/*コンセプト*/
@media (min-width: 751px) {.con-fl{
width:48%;
padding:10px;
float:left;}}
.cb{
clear:both;
}
/*ページ全体の幅を狭め中央寄りにする*/
@media (min-width: 751px) {.about-width{margin-left: 15%;}}
/*プロフィール画像の枠 右幅を縮める*/
@media (max-width: 750px) {.prof-width{margin-right:15%;}}/*スマホ*/
@media (min-width: 751px) {.prof-width{margin-right: 30%;}} /*PC*/
.flickity-page-dots li.dot.is-selected{
display:none !important;
}
/************************************************************
Voice ページ
**********************************************************/
/*Voiceページのみ 一覧表示時に見えるタイトルの文字サイズを変更*/
.post-name-voice .pt-cv-title{
font-size:1.5em !important;
}
/*Voiceページのみ 一覧表示時に見える本文のh2 (投稿分署のタイトル）の文字サイズを変更*/
.post-name-voice .pt-cv-content h2{
font-size:1.4em !important;
}
/*Voiceページのみ 一覧表示時に見える本文の文字サイズを変更*/
.post-name-voice .pt-cv-content p{
font-size:1.2em !important;
}
/*一覧表示時の各情報ページの間隔を変更*/
.post-name-voice .pt-cv-ifield{
padding-bottom:5em !important;
}
@media (max-width: 750px) {.post-name-voice .pt-cv-content img{
width: 35%;
margin-left: 30%;
}
}
/*.post-name-voice .pt-cv-content .panel-layout .panel-grid-cell .custom-html-widget h2{
font-size:1.3em !important;
}*/
/*ページネーションの色
.pt-cv-wrapper .pagination>li>a, .pt-cv-wrapper .pagination>li>span {
color: #fff;
background-color: #c0c0c0;
border-color: #c0c0c0;
}*/
/*.btn-success:hover,
.btn-success:focus{
color: #fff;
background-color: #dcdcdc !important;
border-color: #dcdcdc !important;
}*/
/************************************************************
STORY ページ
************************************************************/
/* ページ内の ｈ２ ｈ３ P */
@media (min-width: 751px) {.category-story h2{
font-size:21px !important;
font-weight:bold !important;
line-height:1.6em !important;
}}
@media (max-width: 750px) {.category-story h2{
font-size:18px !important;
font-weight:bold !important;
line-height:1.5em !important;
}}
.category-story p{
font-size:15px;
line-height:1.8em;
text-align: justify
}
.category-story h3{
font-size:16px !important;
font-weight:bold !important;
margin-bottom:0 !important;
}
/* ページ・トップのタイトル枠の幅 */
@media (min-width: 751px) {.sub-t-width{
margin-left:2em;
margin-top:2em;
}}
@media (max-width: 750px) {.sub-t-width{
margin-left:2em;
margin-top:-1em;
}}
/* ページ・トップのタイトル枠内の画像*/
@media (min-width: 1141px) {.title-img{
margin-bottom:-0.7em !important;
}}
@media (max-width: 1140px) and (min-width: 782px){.title-img{
margin-bottom:-0.5em !important;
}}
@media (max-width: 781px) {.title-img{
margin-bottom:-2em !important;
}}
/* ページ・トップのタイトル枠内のh2 */
@media (min-width: 1141px) {.sub-t-width h2{
font-size:30px !important;
line-height:1.5em !important;
margin-top:10% !important;
}}
@media (max-width: 1140px) and (min-width: 782px){.sub-t-width h2{
font-size:20px !important;
line-height:1.3em !important;
}}
@media (max-width: 781px) {.sub-t-width h2{
font-size:22px !important;
line-height:1.2em !important;
margin-top:5% !important;
}}
/* ページ・トップのタイトル枠内の文字*/
@media (min-width: 1141px) {p.stry-sub-tiitle{
font-size:23px;
line-height:1.7em !important;
font-weight:bold ;
}}
@media (max-width: 1140px) and (min-width: 782px){p.stry-sub-tiitle{
font-size:20px;
line-height:1.3em !important;
font-weight:bold ;
}}
@media (max-width: 781px) {p.stry-sub-tiitle{
font-size:19px;
font-weight:bold ;
line-height:1.3em !important;
}}
/* 幅 */
@media (min-width: 782px){.story-width{
margin-left:7%;
margin-right:7%;
}}
@media (max-width: 781px){ .story-width{
margin-left:3%;
margin-right:3%;
}}
/* 点線の罫線 */
.dashed {
border-bottom: 1px dashed #a9a9a9 ;
}
/* ページ最下部 前編・後編 の 文字と色*/
.part-text-1{
font-size:20px;
border-bottom:1px solid black;
padding-bottom:3px;
/* font-weight:bold;*/
color:black;
margin-right:1.5em;
}
.part-text-2{
color:#808080;
font-size:20px;
margin-right:1.5em;
}
.part-text-2:hover {
cursor: pointer;
color: #0068b7;
font-weight:bold;
}
/* ブロックに囲み罫線 */
@media (min-width: 782px){.frame-1 {
padding: 3em;
border: solid 1px #a9a9a9;
}}
@media (max-width: 781px){.frame-1 {
padding: 2em 2em 1em 2em ;
border: solid 1px #a9a9a9;
}}
/************************************************************
共通 各ページで利用する画面サイズ幅 hr幅 文字サイズ 文字色 他
**********************************************************/
/*画面横幅いっぱい */
.full-width {
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
}
/*一般コンテンツの幅
@media (min-width: 751px) {.content-width{
margin-left:10%;
margin-right:10%;
}}
@media (max-width: 750px) {.content-width{
margin-left:5%;
margin-right:5%;
}}*/
.content-width{
margin-left:5%;
margin-right:5%;
}
/*スマホ・タブレットで表示する*/
@media (max-width: 750px) {.only_pc {display:none}} /*スマホでのみ表示する （only_pc クラスを非表示）*/
/*PCで表示する*/
@media (min-width: 751px) {.only_mb {display:none}} /*PCでのみ表示する （only_mb クラスを非表示）*/
/*画像オンマウスで半透明化*/
.gazou:hover {
opacity: 0.7;
}
/*左寄せ*/
.left{
text-align:left;
}
/*右寄せ*
.right {
text-align:right;
}*/
/*センタリング*/
.center{
text-align:center;
}
/* 背景色 *
.bg-white{
background:white;
}*/
/* 文字色・サイズ */
.black{
color:black;
}
.red{
color:red;
}
.blue{
color:blue;
}
.deep-gray{
color:gray;
}
.bold{
font-weight:500;
}
.font-s{
font-size:1.1em;
}
.font-m{
font-size:1.7em;
}
.font-l{
font-size:2em;
}
/* */
/* ヘッダー */
/* */
/*ヘッダータイトル文字色 ルミナリエの残り？
h1.page-header_pageTitle{
color:#fff462;
}
*/
/* */
/* Top Page */
/* */
/*フーレバナーの文字
.foulee-text{
color:#e62f8b;
font-weight:bold;
font-size:12px;
}*/
/*アンダーライン 黄色蛍光ペン風
.yellow-under{
background: linear-gradient(transparent 50%, yellow 50%);
}*/
/* */
/* フォーム */
/* */
/*フォーム全体の幅（左右マージン） テキストの太さ*/
@media (min-width: 751px){.form-width{margin:0 17% !important;}}
/* 入力項目の文字の太さを変更
* ※ テキストエリアは innput ではなく、textarea#ID名 になるので注意！
* ※ tel は ID名 ではなく、 input.field になるので注意！ */
.form-width textarea#inquiry, .form-width input#company, .form-width input#name, .form-width input.field, .form-width input#mail, .form-width input#mail-confirm, .form-width input#web{
font-weight:300 !important;
}
/*フォーム 必須 */
.must {
padding:1px;
background: #FF1A00;
color: white;
font-size: 65%;
vertical-align: top;
position: relative;
top: -0.1em;
border-radius: 3px;
}
/**チェックボックスを細字に*/
.mwform-checkbox-field-text, .mwform-radio-field-text{
font-weight:100;
}
/**チェックボックスを細字に*/
.caution{
color :red;
font-size:0.9em;
}
/*.mw-wp-form input[type="text"]::placeholder,*/
textarea::placeholder,
input[type="text"]::placeholder,
input[type="url"]::placeholder{
color:#a9a9a9 !important;
font-weight:100 !important;
}
/*フォーム フィールド幅 *
.field{
display: block;
width: 350px !important;
margin-right:15px;
}*/
/* ヨガ申し込みフォーム チェックボタンリストの表示 *
.horizontal-item{
display:block;
}*/
/* ヨガ申し込みフォーム チェックリストの頭揃え *
#questionnaire-1, #category-1{
margin-left:14px !important;
}*/
/*フォーム 段落間隔*/
.space{
line-height:2em;
}
/*フォーム注意書き クレパス線*
.crepas-minayoga{
background: linear-gradient(white, #ffb6c1);
}*/
/*フォーム注意書き 囲み線*/
.box {
padding: 10px;
background: #fff;
border: 1px #ff69b4 solid;
box-shadow: 0 2px 3px 0 #ddd;
}
/* */
/* フッター */
/* */
/*コピーライト 非表示 */
footer .copySection p:nth-child(2) {
display:none !important;
}
.site-footer-copyright p:nth-child(2) {
display:none;
}
/*お問い合わせボタン */
.button {
background-color: #c0c0c0 !important;
color:#fff !important;
border-style: solid; border-color: #c0c0c0; border-width:1px !important;
}
.button:hover {
background-color: #dcdcdc !important;
color:#fff;
border-style: solid; border-color: #dcdcdc; border-width:1px !important;
}
/************************************************************
チャット
**********************************************************/
/* チャット の列の幅 */
.chat-box{
background:white;
padding:0em 1.7em 3em ;
}
/* チャット */
.chat-bubble {
display: grid;
gap: 1em 0;
padding:1em 8.5em;
/* padding: 25px 15px;*/
/* background-color: #769ece;*/
}
.chat-bubble__section {
display: flex;
align-items: center;
gap: 0 15px;
}
.chat-bubble__img {
width: 3em;
height: 3em;
}
.chat-bubble__img-0 {
width: 5em;
height: 5em;
margin-top:-8em;
/*margin-top:-5em;*/
}
.chat-bubble__img-2 {
width: 5em;
height: 5em;
margin-top:-3em;
}
.chat-bubble__img-3 {
width: 5em;
height: 5em;
margin-top:-1em;
}
.chat-bubble__text {
display: inline-block;
position: relative;
max-width:50%;
/* max-width: 55%;*/
margin: 0;
padding: 1em 1.5em;
border-radius: 10px;
color: #333;
font-size: 1.1em;
letter-spacing:0.1em;
line-height:1.4em;
}
.chat-bubble__text.left {
background-color: #f5f5f5;
}
.chat-bubble__text.right {
background-color: #ffe641;
margin: 0 1em 0 auto;
}
.chat-bubble__text.right-2 {
background-color: #c8eb64;
margin: 0 10px 0 auto;
}
.chat-bubble__text::before {
position: absolute;
top: -15px;
width: 20px;
height: 30px;
content: '';
}
.chat-bubble__text.left::before {
left: -10px;
margin-top:1em;
border-radius: 0 0 0 15px;
box-shadow: -3px -15px 0 -7px #f5f5f5 inset;
}
.chat-bubble__text.right::before {
right: -10px;
margin-top:1em;
border-radius: 0 0 15px 0;
box-shadow: 3px -15px 0 -7px #ffe641 inset;
}
.chat-bubble__text.right-2::before {
right: -10px;
margin-top:1em;
border-radius: 0 0 15px 0;
box-shadow: 3px -15px 0 -7px #c8eb64 inset;
}