@charset "UTF-8";/*マイス*/
body{
	font-family: "Zen Kaku Gothic Antique", sans-serif;
	font-weight: 500;
	font-style: normal;
}
.l-header__drop-nav {
	background-color: rgba(255, 255, 255, 0.9);
}

/*-------------------------
見出し設定 
--------------------------*/
h1.title1-top{/*TOPページの見出し*/
	font-family: 'Noto Serif JP', serif !important;
	font-size: 1.8rem;
	font-weight: 500 !important;
}
h1.title1-top::after {
  content: "";
  display: block;
  width: 40px;                          /* 線の横幅（お好みで調整） */
  height: 2px;                          /* 線の太さ */
  background-color: orange;             /* 線の色 */
  margin: 0.5rem auto 0;               /* 上からの余白, 左右中央寄せ */
}


/* メインビジュアルの上のh1文字設定↓ */
h1.mainvisual-ontext{
	font-size: 1.3rem;
}
h1.mainvisual-ontext:first-line{
	font-size: 180%;
}
/* メインビジュアルの上のh1文字設定↑ */

@media (max-width: 640px){ 
h1.title1-top{/*TOPページの見出し*/
	font-family: 'Noto Serif JP', serif !important;
	font-size: 1.5rem;
	font-weight: 500 !important;
}
}
h1.title1-top::after {
  content: "";
  display: block;
  width: 40px;                          /* 線の横幅（お好みで調整） */
  height: 2px;                          /* 線の太さ */
  background-color: orange;             /* 線の色 */
  margin: 0.5rem auto 0;               /* 上からの余白, 左右中央寄せ */
}

h1.title1{
	text-shadow: 3px 4px 10px rgb(50 50 70);
	font-size:2.75rem;

}

h1.h1-title-transparent{
	opacity:0;
}

h2.title2{
	font-size: 1.8rem !important;
	font-weight: 700 !important;
}

h2.title2-bar{/*各ページの見出し*/
	font-family: 'Noto Serif JP', serif !important;
	font-size: 1.8rem;
	font-weight: 500 !important;
}
h2.title2-bar::after {
  content: "";
  display: block;
  width: 40px;                          /* 線の横幅（お好みで調整） */
  height: 2px;                          /* 線の太さ */
  background-color: orange;             /* 線の色 */
  margin: 0.5rem auto 0;               /* 上からの余白, 左右中央寄せ */
}



@media (max-width: 640px){ 
h2.title2 {
    font-size: 1.4rem!important;
	font-weight: 700 !important;
}
}


h3.title3 {
	font-family: 'Noto Serif JP', serif !important;
    font-weight: 500 !important;
    font-size: 2rem !important;

}

h3.title3-bar {/*短いアンダーバー*/
	font-family: 'Noto Serif JP', serif !important;
    font-weight: 500 !important;
    font-size: 2rem !important;
}

h3.title3-bar::after {/*短いアンダーバー*/
  content: "";
  display: block;
  width: 40px;                          /* 線の横幅（お好みで調整） */
  height: 2px;                          /* 線の太さ */
  background-color: orange;             /* 線の色 */
  margin: 0.5rem auto 0;               /* 上からの余白, 左右中央寄せ */
}

h3.title3large {
    font-weight: 600!important;
    font-size: 1.65rem !important;

}
h3.midashi-ornge {
	font-size: 1.35rem !important;
	font-weight: 700 !important;
	display: inline-block;
	border-left: solid 5px #F8A201;
	padding: 0px 0px 0px 15px !important;
    margin: 0px 10px 15px 10px !important;
}


@media (max-width: 640px){ 
h3.title3 {
	font-family: 'Noto Serif JP', serif !important;
    font-size: 1.5rem!important;
	font-weight: 500 !important;

}

h3.title3large {
	color:#418BCF;
    font-weight: 600!important;
    font-size: 1.45rem !important;

}
	
h3.title3-bar {/*短いアンダーバー*/
	font-family: 'Noto Serif JP', serif !important;
    font-weight: 500 !important;
    font-size: 1.5rem !important;
}

h3.title3-bar::after {/*短いアンダーバー*/
  content: "";
  display: block;
  width: 40px;                          /* 線の横幅（お好みで調整） */
  height: 2px;                          /* 線の太さ */
  background-color: orange;             /* 線の色 */
  margin: 0.5rem auto 0;               /* 上からの余白, 左右中央寄せ */
}

h3.midashi-ornge {
	font-size: 1.2rem !important;
	font-weight: 700 !important;
	display: inline-block;
    border-left: solid 5px #F8A201;
    padding: 0px 0px 0px 15px !important;
    margin: 0px 5px 0px 5px !important;
}
}


h4.title4 {
	font-size: 1.1rem !important;
	font-weight: 700 !important;

}

h4.title4-border{
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	border-bottom: 1px solid #F8A201;
	padding-bottom: 10px;
}

@media (max-width: 640px){ 
h4.title4 {
    font-size: 1.0rem!important;
	font-weight: 700 !important;

}
}

h5.title5obi {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	color: #418BCF;
	background-color:#E8F4FF;
	border-radius: 20px;
	padding-right:20px;
	padding-left:20px;
	margin-bottom: 10px;
	display:inline;
}
@media (max-width: 640px){ 
h5.title5obi {
    font-size: 1rem!important;
	font-weight: 700 !important;
	color: #418BCF;
	background-color:#E8F4FF;
	border-radius: 20px;
	padding-right:20px;
	padding-left:20px;
	margin-bottom: 10px;
	display:block;
}
}

	

/*-------------------------
ヘッダー・グローバルナビ設定
--------------------------*/


/*グローバルナビ サブメニュー幅調整*/
.c-navbar__submenu {
  min-width: 310px; /* ご希望に応じてこの値を調整してください */
}
/**PCグロナビオレンジ文字太字**/
.c-navbar__item small {
    font-weight: bold !important;
}

/**郵便番号のハイフンなしでの吹き出し非表示**/
/* 追加CSSで消す記述 */

#autozip {
   display: none !important;
}





/**** bogo多言語↓ ****/

/* Dropdown */
.bogo-dropdown {
  gap: 0;
  align-items: flex-start;
  height: 44px;
}

/* Language Switcher */
.bogo-language-switcher {
  display: none !important;
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #CACACA;
  border-top: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  width: 100%;
  z-index: 1000;
  padding: 4px 0;
  font-size: 14px;
  border-radius: 0 0 4px 4px;
}

.bogo-language-switcher li {
  cursor: default;
  box-sizing: border-box;
  padding: 6px 12px;
  text-align: left;
  white-space: nowrap;
}

.bogo-language-switcher li a {
  text-decoration: none;
  font-weight: 600;
}

.active .bogo-language-switcher li:hover {
  background: var(--wp--preset--color--contrast);
}

.active .bogo-language-switcher li:hover a {
  color: var(--wp--preset--color--accent);
}

.bogo-language-switcher .ja {
  order: 1;
}

.bogo-language-switcher .en-GB {
  order: 2;
}

.bogo-language-switcher li:hover {
  background: #f5f5f5;
}

.bogo-language-switcher li:hover a {
  color: inherit;
}

/* Display Item */
.display-item {
  transition: 0.15s ease;
  width: 96px;
  border: 1px solid #CACACA;
  border-radius: 4px;
  padding: 8px;
  text-align: left;
  border-radius: 4px 4px 0 0;
  border-bottom: 1px solid #FDFFFA;
  padding-bottom: 0;
  font-weight: 600;
  position: relative;
  cursor: pointer;
  display: inline-block;
}

.bogo-language-name a {
  display: block;
  width: 100%;
  color: #333;
}

/* Arrow */
.arrow {
  width: 13px;
  height: 13px;
  display: inline-block;
  position: relative;
  bottom: -8px;
  left: -10px;
  transition: 0.4s ease;
  margin-top: 2px;
  text-align: left;
  transform: rotate(45deg);
  float: right;
}

.arrow:before,
.arrow:after {
  position: absolute;
  content: '';
  display: inline-block;
  width: 12px;
  height: 3px;
  background-color: var(--wp--preset--color--contrast);
  transition: 0.4s ease;
}

.arrow:after {
  transform: rotate(90deg);
  top: -5px;
  left: 5px;
}

/* Active Arrow */
.display-item.active .arrow {
  transform: rotate(45deg) translate(-5px, -5px);
}

.display-item.active .arrow:before {
  transform: translate(10px, 0);
}

.display-item.active .arrow:after {
  transform: rotate(90deg) translate(10px, 0);
}

/* Active List */
.display-item.active ul {
  opacity: 0.3;
  height: 108px;
}

/* Language Switcher Animation */
.wp-block-bogo-language-switcher .bogo-language-switcher {
  height: 0;
  overflow: hidden;
  padding-bottom: 4px;
  transition: 0.4s ease;
}

/* CSS Variable for Height */
:root {
  --item-height: 34px;
}

.wp-block-bogo-language-switcher.active .bogo-language-switcher {
  height: calc(var(--item-height) * var(--list-items));
  overflow: auto;
  padding-bottom: 0;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Disabled Styles */
.bogo-disable {
  color: var(--wp--preset--color--accent-5);
}

.bogo-disable .arrow:before,
.bogo-disable .arrow:after {
  background-color: var(--wp--preset--color--accent-5);
}

/* 最初は非表示 */
.bogo-language-switcher {
  display: none !important;
  position: absolute;
  z-index: 9999;
  background: #fff;
  border: 1px solid #ccc;
  padding: 8px 0;
  margin-top: 5px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* display-item に active が付いたとき、list-view を強制表示 */
.display-item.active ~ .bogo-language-switcher {
  display: block!important;
}

.wp-block-bogo-language-switcher.active .bogo-language-switcher,
.display-item.active ~ .bogo-language-switcher {
  display: block !important;
  height: auto !important;
  overflow: visible;
}

/* 親コンテナ：横並びに */
.c-header-content {
  display: flex;
  align-items: center;
  gap: 20px; /* 言語切り替えと電話の間に余白 */
  position: relative;
}

.language-select {
  padding: 8px 12px;
  font-size: 14px;
  border: 2px solid #000000;
  border-radius: 6px;
  background-color: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 140'%3E%3Cpolyline points='20,50 70,100 120,50' stroke='%23000' stroke-width='15' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px;
  width: 200px;
  font-family: "Zen Kaku Gothic Antique", sans-serif;
}
@media (min-width: 1025px) {
  .language-select {
    display: none !important;
  }
}


.language-select-wrapper {
  position: relative;
  display: inline-block;
}




/* ページ読み込み後に表示 */
body.js-language-ready .language-select {
  visibility: visible;
}

.language-switcher-wrapper {
  display: flex;
  justify-content: center;  /* 中央に寄せる */
  margin-top: 20px;         /* 上に余白 */
}

/* カスタム言語スイッチャー */
#language-switcher-container {
  position: relative; /* ドロップダウンリストの位置決めの基準 */
  display: inline-block;
  font-family: 'Zen Kaku Gothic Antique', sans-serif; /* フォントファミリーを他の部分と合わせる */
}

.custom-language-switcher {
  display: inline-block;
  position: relative;
  width: 200px; /* ★共通の幅を指定 */
}

.custom-language-switcher-trigger {
  padding: 8px 12px;
  border: 2px solid #000000; /* トリガーの枠線を黒の2pxに変更 */
  background-color: #fff; /* 背景色を白に */
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  color: #333; /* 文字色 */
  font-size: 14px; /* 文字サイズ */
}

.custom-language-switcher-arrow {
  margin-left: 10px;
  font-size: 0.8em;
  color: #555;
}

.custom-language-switcher-options {
  display: block;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: white;
  border: 2px solid #000000 !important;
  border-top: none !important;
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 1000;
  box-shadow: 0 3px 6px rgba(0,0,0,0.1);
  max-height: 200px;
  width: 100%; /* ★親の幅に合わせる */
  overflow-y: auto;
  box-sizing: border-box;
}

.custom-language-option {
  padding: 10px 12px;
  cursor: pointer;
  white-space: nowrap;
  font-size: 14px;
  color: #333;
  border-bottom: 1px solid #f0f0f0; /* 区切り線 */
}
.custom-language-option:last-child {
  border-bottom: none;
}

.custom-language-option:hover {
  background-color: #f0f0f0; /* マウスオーバー時の背景色 */
}

.custom-language-option.selected {
  font-weight: 500; /* 現在選択中の言語を少し太字に */
  background-color: #e9e9e9; /* 選択中の背景色 */
}

/* 2. hover時に表示 */
.custom-language-switcher:hover .custom-language-switcher-options {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

/* 3. 矢印を上向きに変更（オプション） */
.custom-language-switcher:hover .custom-language-switcher-arrow {
  transform: rotate(180deg);
}


/*ここまで*/




/* 親コンテナをFlexboxにする場合の例 */
.my-header-content {
  display: flex;          /* 横並びに配置 */
  align-items: center;    /* 縦位置を中央に揃える */
}

/* 電話番号ブロック（左側） */
.my-header-content__tel {
  margin-right: 20px;     /* 電話番号ブロックとボタンの間を広げる */
  /* 必要に応じて display:inline-block; 等でもOK */
}

/* 電話番号 */
.header-tel {
  font-size: 2em;       
  margin: 0;              /* 余白をリセット */
  line-height: 1.2;       /* 行間をやや詰める */
  color: #28960D;
  font-weight: 600;
}

/* 受付時間 */
.ss-small {
  margin: 0;              /* 余白をリセット */
  line-height: 1.2;       /* 行間をやや詰める */
  display: block;         /* ブロック表示で上下に配置 */
}

/* 青いボタン */
.cart-banner {
  /* 必要に応じて追加の調整 */
  display: inline-flex;   /* 必要以上に幅をとらない */
  align-items: center;    /* アイコンと文字の縦位置を中央に */
  background-color: #0054b4;
  color: #fff;
  padding: 10px 20px;
  text-decoration: none;
}

.cart-banner:hover {
  background-color: #0046a0;
}

/* ...アイコンやテキストのCSSは以前のまま... */

/*DrPassとExpats購入ボタン↓*/
.cart-banner {
  display: flex;
  /* アイコンとテキストの縦位置を中央揃え */
  align-items: center;
  background-color: #0054b4;
  color: #fff;
  padding: 3px 15px 7px 15px;
  text-decoration: none; /* リンク下線の除去 */
}

/* ①行間を狭くし、②文字サイズを同じにする */
.cart-title {
  font-size: 0.85rem;     /* サブタイトルと同じサイズに */
  font-weight: bold; /* 太字を解除して揃える */
  margin-bottom: 0em;
  line-height: 1.2;/* タイトルとサブタイトルの間を少しだけ空ける */
}

.cart-subtitle {
  font-size: 0.85rem;     /* タイトルと同じサイズに */
 line-height: 1.3;    /* 行間をやや狭く */
  font-weight: bold;
}

/* テキストを縦方向に2行にする */
.cart-text {
  display: flex;
  flex-direction: column;
}

/* カートアイコンの縦サイズを2行分に合わせる（目安） */
.cart-icon {
  height: 1.75em;  /* テキスト2行分ほどの高さに調整*/
  width: auto;
  margin-right: 10px;
　 margin-top: 0.15rem;
	margin-bottom: 0.15rem;
	margin-bottom: 0.15rem;
}

/* ホバー時の演出（お好みで） */
.cart-banner:hover {
  background-color: #0046a0;
}
/*DrPassとExpats購入ボタン↑*/


/**PCグロナビ英語を黒・日本語をオレンジ**/
/* 英語 */
.c-navbar__item a span {
  color: #333 !important; 
}

/* 日本語部分オレンジ */
.c-navbar__item a small  {
  color: #CE5F00 !important;
  font-weight: 700;
}

/**contactお問合せ・ご相談ボタン設定↓**/

.menu-item-contact > a {
  margin: auto;
  display: inline-flex;       /* ボタン化のため inline-flex */
  align-items: center;        /* 縦中央揃え */
  justify-content: center;    /* 横中央揃え（お好みで） */
  height: 20px;               /* 固定高さを指定する例（小さめ） */
  box-sizing: border-box;
  border: 2px solid #528E40;
  color: #528E40!important;
  text-decoration: none;
  transition: background-color 0.3s, color 0.3s;
  font-size: 1rem!important;
}

/* ホバー時のスタイル */
.menu-item-contact > a:hover {
  background-color: #528E40!important;
  color: #fff!important;
}



/* Contact us */
.contact-line {
  font-size: 1rem!important;
  color: #528E40!important;
}
.menu-item-contact > a:hover .contact-line {
  color: #fff!important;
}


/**contactお問合せ・ご相談ボタン↑**/

/*------------------------------
文字設定
--------------------------------*/

/*****リンクしても文字色変更しない　link-nondeco↓*****/
.link-nondeco a{
    color: inherit !important; /* 親要素の文字色を継承する */
    text-decoration: none; /* 必要に応じて下線も消す */
}
/* ホバー時も色を変えない */
.link-nondeco a:hover {
    color: inherit !important;
    text-decoration: none; /* 必要なら下線も消す */
}

/* クリック済みのリンクも色を変えない */
.link-nondeco a:visited {
    color: inherit !important;
}

/*****リンクしても文字色変更しない　link-nondeco↑*****/


/*------------------------------
コンテンツ設定
--------------------------------*/

/********TOP設定↓********/

/**** メインビジュアルPC＆タブ表示の際にsp版スペース詰める↓****/
/* PC・タブレット（幅640px以上）のとき */
@media screen and (min-width: 641px) {
  .mainvis-pc {
    display: block;
  }
  .mainvis-sp {
    display: none;
  }
}

/* スマホ（幅640px以下）のとき */
@media screen and (max-width: 640px) {
  .mainvis-pc {
    display: none;
  }
  .mainvis-sp {
    display: block;
  }
}
/**** メインビジュアルPC＆タブ表示の際にsp版スペース詰める↑****/

.gothic-text {　/*マイス5つの強み「5」だけ強調*/
  font-family: 'Zen Kaku Gothic Antique', sans-serif !important;
  font-size: 3.5rem;
  font-weight: 700;
  color: #e09008;  
}
.gothic-text-s {　/*マイス5つの強み数字だけ強調*/
  font-family: 'Zen Kaku Gothic Antique', sans-serif !important;
  font-size: 2rem;
  font-weight: 700;
  color: #e09008;  
}

/**** NEWS部分↓ ****/
.top-news.wp-block-latest-posts__list > li {
  position: relative;
  padding-bottom: 1em; /* 線との間に余白 */
  margin-bottom: 1.5em;
  border-bottom: 1px solid #D6D6D6;
}

.top-news .wp-block-latest-posts__post-title{/*タイトル太字*/
	font-weight: 700;
}

/**サイドバー Latest articles**/
.Latest-articles h4.c-entry-summary__title{
	font-size: 0.9rem!important;
	font-weight: 500!important;
	line-height: normal!important;
}
.Latest-articles.c-entries--simple .c-entry-summary__meta{
	margin-top: 0!important;
}



/**** NEWS部分↑ ****/


/********TOP設定↑********/

/********共通設定↓********/

/******ボタン設定↓******/
/****＞付きボタン設定↓****/
.smb-buttons {
    display: flex !important;
    width: 100%; /* 親要素の幅いっぱいにする */
}

.smb-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    text-align: center;
}

/* ボタン内部のテキストを適切に配置 */
.smb-btn__label {
    flex-grow: 0; /* 不要な伸びを防ぐ */
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* 矢印アイコンの位置を調整 */
.smb-btn__label::after {
    content: "\f105"; /* FontAwesomeの「>」アイコン */
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    position: absolute;
    right: 10px; /* 右端に配置 */
    top: 50%;
    transform: translateY(-50%);
}

/*ボタン白+黒フチ設定*/
.bt-white {
	border: 1px #333333 solid !important;
	border-radius: 30px;
}
/**＞付きボタン設定↑**/


/*1行や2行でもボタンの位置を同じにする*/
.wp-block-group.is-layout-grid:first-child {
    display: flex;
    align-items: stretch; /* 各ボックスの高さを揃える */
}

/*******ボタン設定↑********/

/* 画像を高さ統一 */
.wp-block-group.is-layout-grid:first-child .wp-block-image img {
    height: 100%;
    object-fit: cover; /* 画像の比率を維持しつつ枠内にフィット */
}


.title4-tate {
    min-height: 3.5em; /* タイトルの高さを統一 */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.smb-buttons {
    margin-top: auto; /* ボタンを最下部に揃える */
}


/*本文縦組の画像+小見出しの余白を小さく調整*/
.photo-text-tate.wp-block-group-is-layout-flex {
  gap: 0.5rem !important;  /* 値はお好みで調整（例: 1rem → 0.5rem で半減） */
}


/*ヘッダー下のコンテンツの上部の余白を削除*/
.l-contents__inner {
  margin-top: 0 !important;
  padding-top: 0 !important;	
}

/*画像スライダー矢印*/

.spider__arrow::before {
    border: none !important;
    width: auto !important;
    transform: initial !important;
}

.spider__arrow[data-direction="prev"]::before {
    content: url(/wpmais/wp-content/uploads/2025/03/arrow-left2.png) !important;
}

.spider__arrow[data-direction="next"]::before {
    content: url(/wpmais/wp-content/uploads/2025/03/arrow-right2.png) !important;
}

/*セクションの見出し下の線を消す*/
.section-nonline .smb-section__title:after {
    display: none !important;
}
.section-nonline .smb-section__title {
    margin-bottom: -20px !important; /* 余白を減らして上に移動 */
}

/*******パターン問い合わせボタン↓********/
.toiawase-bt {
    background-image: url(/wpmais/wp-content/uploads/2025/03/bt-toiawase-bg.png)!important;
    background-repeat: repeat; /* タイリング表示 */
    background-size: auto; /* 元サイズで表示 */
    background-position: top left; /* 左上から表示 */
    text-align: center; /* 中央揃え */
	position: relative; /* 重ね合わせのために必要 */
    overflow: hidden; /* はみ出しを防止 */
}
/* リンク要素（背景色指定がある）を透明に */
.toiawase-bt a {
    background-color: transparent !important; /* リンク背景色を透明に */
    padding: 20px; /* 必要に応じて内側の余白を設定 */
    display: block; /* 確実に要素をブロック化 */
}
/* ホバー用の擬似要素を追加 */
.toiawase-bt::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2); /* 半透明の黒 */
    opacity: 0;
    transition: opacity 0.3s ease; /* アニメーション */
    pointer-events: none; /* 擬似要素に干渉させない */
}

/* ホバー時に半透明のレイヤーを表示 */
.toiawase-bt:hover::after {
    opacity: 1;
}



/***問い合わせボタン小↓***/
.bt-toiawase-s{
	 background-image: url(/wpmais/wp-content/uploads/2025/03/bt-toiawase-bg.png)!important;
}
/* リンク要素（背景色指定がある）を透明に */
.bt-toiawase-s a {
    background-color: transparent !important; /* リンク背景色を透明に */
}
/* ホバー用の擬似要素を追加 */
.bt-toiawase-s::after {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2); /* 半透明の黒 */
    opacity: 0;
    transition: opacity 0.3s ease; /* アニメーション */
}

/* ホバー時に半透明のレイヤーを表示 */
.bt-toiawase-s:hover::after {
    opacity: 1;
}

/***問い合わせボタン小↑***/

/*******パターン問い合わせボタン↑********/



/*******パターン注文ボタン↓********/
.chumon-bt {
    background-image: url(/wpmais/wp-content/uploads/2025/03/bt-koukoku-bg.png)!important;
    background-repeat: repeat; /* タイリング表示 */
    background-size: auto; /* 元サイズで表示 */
    background-position: top left; /* 左上から表示 */
    text-align: center; /* 中央揃え */
	position: relative; /* 重ね合わせのために必要 */
    overflow: hidden; /* はみ出しを防止 */
}
/* リンク要素（背景色指定がある）を透明に */
.chumon-bt a {
    background-color: transparent !important; /* リンク背景色を透明に */
    padding: 20px; /* 必要に応じて内側の余白を設定 */
    display: block; /* 確実に要素をブロック化 */
}
/* ホバー用の擬似要素を追加 */
.chumon-bt::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2); /* 半透明の黒 */
    opacity: 0;
    transition: opacity 0.3s ease; /* アニメーション */
    pointer-events: none; /* 擬似要素に干渉させない */
}

/* ホバー時に半透明のレイヤーを表示 */
.chumon-bt:hover::after {
    opacity: 1;
}


/***注文ボタン小↓***/
.bt-order-s{
	 position: relative; /* 擬似要素の基準位置を明確にするために必要 */
	 display: inline-block; /* ボタンの幅を適正に保つため */
	 background-image: url(/wpmais/wp-content/uploads/2025/03/bt-koukoku-bg.png)!important;
}
/* リンク要素（背景色指定がある）を透明に */
.bt-order-s a {
    background-color: transparent !important; /* リンク背景色を透明に */
    padding: 20px; /* 必要に応じて内側の余白を設定 */
    display: block; /* 確実に要素をブロック化 */
}
/* ホバー用の擬似要素を追加 */
.bt-order-s::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2); /* 半透明の黒 */
    opacity: 0;
    transition: opacity 0.3s ease; /* アニメーション */
    pointer-events: none; /* 擬似要素に干渉させない */
}

/* ホバー時に半透明のレイヤーを表示 */
.bt-order-s:hover::after {
    opacity: 1;
}

/***注文ボタン小↑***/


/*******パターン注文ボタン↑********/



/*******リード文の幅調整********/
.leadtext {
    width: 100%;                  /* 基本は親要素に合わせて可変 */
    max-width: 800px;             /* 最大幅は800pxまで */
    min-width: 250px;             /* 最小幅は345px以下にはならない */
    margin-left: auto;            /* 左右中央揃え */
    margin-right: auto;
    box-sizing: border-box;       /* paddingやborderを含んで計算 */
}



/****テーブルヘッダーの背景色調整****/

.table-head-kon.wp-block-table thead th {
    background-color: #0B427F !important; /* 紺色（自由に調整可能） */
    color: #ffffff !important; /* 文字色を白にして視認性を高める */
}


/*****情報ブロック余白の調整****/
.smb-information__item{
	padding-bottom: 20px!important;
	margin-top: 10px!important;
	border-bottom: dotted 1px #DEDEDE!important;

}
.smb-information__item .c-row__col{
	margin: 0!important;
	padding-bottom: 20px!important;
}


/****スマホサイズ改行↓****/
.sp-br {
  display: none;
}

@media screen and (max-width: 420px) {
  .sp-br {
    display: block;
  }
}
/****スマホサイズ改行↑****/

/****画像スライダーのサムネイルサイズ調整↓*****/
/* サムネイル画像を同じサイズに揃える */
.spider__dots .spider__dot {
    height: 100px;  /* 任意の高さを指定 */
    overflow: hidden!important; /* はみ出た部分は非表示 */
    padding: 0!important;
	margin: 0!important;
}

/* 大きな表示の画像をトリミングなしで全体表示 */
.spider__canvas .spider__slide img.spider__figure {
    width: 100% !important;
    max-height: 50v !important;
    object-fit: contain !important; /* トリミングなしで画像全体を表示 */
	margin: 0px!important;
	background-color: #FFFFFF!important;
}
@media screen and (max-width: 640px) {
  .spider__dots .spider__dot {
    width: 50px !important;
    height: 50px !important;
    overflow: hidden !important;
  }

  .spider__dots .spider__dot img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;             /* ←ここが重要 */
    object-position: center center !important; /* ←中央を基準にトリミング */
    display: block; /* スクロール回避用にあると安全 */
		background-color: #FFFFFF!important;
  }
}
/****画像スライダーのサムネイルサイズ調整↑*****/



/*******共通設定↑********/


/**************************
私たちについて
***************************/

/* 会社概要項目の下に線を入れる↓ */
.smb-information__item {
    border-bottom: 1px solid #D1D1D1; /* 赤い線を追加 */
    padding-bottom: 30px; /* 線との間隔を調整 */
    margin-bottom: 0px; /* 各項目の間隔を統一 */
}

/* 最後の行の線 */
.smb-information__item:last-child {
    border-bottom: 1px solid #D1D1D1; /* 最後の項目にも赤線を追加 */
}
/* 会社概要項目の下に線を入れる↑ */


/**************************
Dr.PASSPORT EXPAT'SGUIDE
***************************/

/****動画サイズ****/
.mov-size video {
    width: 250px !important;
    height: 150px !important;
    object-fit: contain; /* 全体を表示する（トリミングなし） */
    display: block;
    background-color: #000; /* 背景を黒に設定（空きスペース対策） */
}

/****情報ブロックに表示される画像サイズ調整****/
@media screen and (max-width: 640px) {
.johou-sp-gazousize img{
	width: 50% !important;
}
}

/**************************
問い合わせページ・注文ページ
***************************/

/*エラーメッセージ*/
.custom-error-message {
    position: relative;
    top: 12px;
}

/* プライバシーポリシーの本文 */
.privacy-policy {
    height: 240px;
    padding: 2em!important;
    overflow: scroll;
}

/* プライバシーポリシーの本文 */
.privacy-policy {
    height: 240px;
    padding: 2em!important;
    overflow: scroll;
}

/* プライバシーポリシーの同意 */
.privacy-agreement {
    border: none!important;
}
.privacy-agreement .smf-item__controls {
    width: fit-content;
    margin-right: auto;
    margin-left: auto;
    font-weight: bold;
}
.privacy-agreement .smf-checkbox-control__control {
    border-color: #333;
    width: 20px!important;
    height: 20px!important;
}
.privacy-agreement .smf-checkbox-control__control:checked {
        background-color: #fff!important;
        border-color: var(--color_main)!important;
}
.privacy-agreement .smf-checkbox-control__control:checked:before {
    border-color: var(--color_main) !important;
    height: 10px;
    width: 7px;
}
/* 確認画面で規約を非表示 */
form[data-screen="confirm"] .form-kiyaku{
 display:none;
}
/*確認画面ボタン*/
.smf-action .smf-button-control__control {
    font-size: 1.2em;
    background-image: none;
	background-color: #2a8000;
    color: #fff;
    border: none;
    transition: box-shadow 0.25s;
    display: inline-block;
    letter-spacing: 1px;
    line-height: 1.5;
    margin: 0;
    min-width: 35%;
    padding: 1em 1.5em;
    position: relative;
    text-decoration: none;
    width: auto;
}

.smf-action .smf-button-control__control:hover {
    border-color: inherit!important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1), 0 12px 24px -12px rgba(0, 0, 0, .2);
	   background-color: #246e00 !important; /* ホバー時に少し濃い緑に変化 */
}

/****注文部数****/

/* 横並び対象をdata-name属性で指定（このフォームのみに適用） */
.smf-placeholder[data-name="ExpatsGuide"],
.smf-placeholder[data-name="DRPASS-JP-EN"],
.smf-placeholder[data-name="DRPASS-JP-CH"],
.smf-placeholder[data-name="DRPASS-JP-DE"],
.smf-placeholder[data-name="DRPASS-JP-ES"],
.smf-placeholder[data-name="DRPASS-PRT-JP"],
.smf-placeholder[data-name="DRPASS-EN-JP"],
.smf-placeholder[data-name="DRPASS-CH-JP"],
.smf-placeholder[data-name="DRPASS-SRV-JP"]

{
    display: flex;            /* 横並びにする */
    align-items: center;      /* 縦方向中央揃え */
}

/* 「部」のテキストを少し離して配置 */
.smf-placeholder[data-name="ExpatsGuide"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-JP-EN"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-JP-CH"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-JP-DE"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-JP-ES"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-PRT-JP"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-EN-JP"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-CH-JP"] .smf-control-description,
.smf-placeholder[data-name="DRPASS-SRV-JP"] .smf-control-description
{
    margin-left: 5px;
}



/*-------------------------
フッター 
--------------------------*/
.l-footer  {
  width:100%;
  background:url(/wpmais/wp-content/uploads/2025/03/footer-bg.png) no-repeat 0 0 / cover;
}
.l-footer-widget-area__item {
  padding:0;
}
.c-copyright{
  display:none;
}

/***メニュー***/
.custom-footer-page-list {
  list-style: none;
  padding: 0;
}
.custom-footer-page-list li {
  margin-bottom: 0.5em;
}
.custom-footer-page-list a {
  text-decoration: none;
  color: inherit;
}


/***電話・営業時間文字サイズ***/
.foot-small{
	font-size: 14px!important;
}


/****スマホ固定フッター周り↓****/
/*背景色変更 */
.p-footer-sticky-nav a{
	padding-top: 6px;
	color:white!important;
	background-color: #e09008 !important;
	font-weight: 600;
	font-size: 0.9rem;
	line-height: 2rem;
}


/****スマホ固定フッター周り↑****/


/***************************
ブログ設定・NEWSページ
****************************/

/**サイドバーカテゴリー＞**/
.news-icon a::before {
  content: "\f105"; /* fa-angle-right の Unicode */
  font-family: "Font Awesome 5 Free"; /* Font Awesome のフォント名 */
  font-weight: 900; /* solid 表示にするために必要 */
  color: orange; /* オレンジ色に */
  margin-right: 5px; /* テキストとの間隔 */
}

/*記事とサイドバーを横並びにする*/
/* PCサイズ：投稿・アーカイブページで横並び */
@media screen and (min-width: 1025px) {
  body.single .l-contents__inner,
  body.archive .l-contents__inner {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 2rem;
  }

  body.single .l-contents__main,
  body.archive .l-contents__main {
    width: 70% !important;
  }

  body.single .l-contents__sidebar,
  body.archive .l-contents__sidebar {
    width: 30% !important;
    margin-top: 0 !important;
  }
}

/* スマホサイズ：投稿・アーカイブページで縦積み */
@media screen and (max-width: 1024px) {
  body.single .l-contents__inner,
  body.archive .l-contents__inner {
    display: block !important;
  }

  body.single .l-contents__main,
  body.archive .l-contents__main,
  body.single .l-contents__sidebar,
  body.archive .l-contents__sidebar {
    width: 100% !important;
  }

  body.single .l-contents__sidebar,
  body.archive .l-contents__sidebar {
    margin-top: 2rem !important; /* メインの下に余白 */
  }
}

/*アイキャッチ画像をトリミングしてサイズ調整*/
.c-entry__thumbnail img {
  width: 100%;            /* 横幅いっぱいに表示 */
  height: 300px;          /* 高さを強制的に指定（←お好みで調整） */
  object-fit: cover;      /* はみ出た部分はトリミング */
  display: block;
  margin: 0 auto;
}

/*著者名と更新日非表示*/
body.single-post .c-meta__item--author,
body.single-post .c-meta__item--modified {
display: none;
}

/*サイドバーのカテゴリーにアイコンつける*/
.wp-block-categories-list li::before {
/* Font Awesome 6（Solid）のフォントを使用する例 */
font-family: "Font Awesome 5 Free"; /* Font Awesomeのフォントファミリー */
font-weight: 900; /* Solidアイコンの場合は900に設定 */
content: "\f105"; /* 例として「angle-right（右向き矢印）」のコード */
display: inline-block;
margin-right: 8px;
color: #F08B00; /* アイコンの色 */
}

/*カテゴリーページ・記事ページのサイドバーのカテゴリーにアイコンつける*/
/* 通常のcat-itemには表示 */
/* 一度すべての .cat-item のアイコン表示をやめる */
.cat-item a::before {
  content: none;
}

/* 表示させたい特定ブロックだけに限定して再度出す */
.wp-widget-categories .cat-item a::before,
.widget_categories .cat-item a::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f105";
  display: inline-block;
  margin-right: 0.5em;
  color: #F08B00;
}





/*NEWSサイドバーの見出し前後に線を入れる*/
.head-border {
    display: flex;
    align-items: center;
}

.head-border:before,
.head-border:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #666;
}

.head-border:before {
    margin-right: 1rem;
}

.head-border:after {
    margin-left: 1rem;
}


/**記事一覧サムネイルのカテゴリー名非表示**/
.c-entry-summary__term {
	  display: none;
}


/* サムネイル下のタイトルと日付を入れ替える */
.c-entry-summary__body {
  display: flex;
  flex-direction: column;
	  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 日付部分をタイトルより上に移動 */
.c-entry-summary__meta {
  order: -1;
	margin-top: 0 !important;
}
.c-entry-summary__meta {
  text-align: left !important;
  margin-left: 0 !important;
  justify-content: flex-start !important; /* 念のため */
}



/****カスタム投稿：実績サイドバー****


*****************************/

/***サイドバー****/

.widget_work_all_categories a{
    color: inherit !important; /* 親要素の文字色を継承する */
    text-decoration: none; /* 必要に応じて下線も消す */
}
/* ホバー時も色を変えない */
.widget_work_all_categories a:hover {
    color: inherit !important;
    text-decoration: none; /* 必要なら下線も消す */
}

/* クリック済みのリンクも色を変えない */
.widget_work_all_categories a:visited {
    color: inherit !important;
}



/* サイドバー全体のマージン・パディングを0に */
.widget_work_all_categories {
    margin: 0;
    padding: 0;
}

/* ULの余白をリセットして左に寄せる */
.widget_work_all_categories ul {
    list-style: none;
}

/* 念のためLIも余白をリセット */
.widget_work_all_categories li {
    list-style: none;

}

/* もし::afterは不要なら削除してOK。残すなら余白リセット */
.widget_work_all_categories ul::after {
    margin-left: 0;
}


/* Font Awesome アイコン表示用 */
.widget_work_all_categories li::before {
    font-family: "Font Awesome 5 Free"; /* Font Awesomeのフォントファミリー */
    font-weight: 900;                  /* Solidアイコンの場合は900に設定 */
    content: "\f105";                  /* 例: angle-rightアイコン */
    display: inline-block;
    margin-right: 8px;
    color: #F08B00;                    /* アイコンの色 */
}


/* 各記事の要素に緑の下線をつける */
.wpaw-recent-posts__item.wpaw-posts-list__item:not(:last-child)::after {/*もしすべての記事に区切り線を付けたい場合は、:not(:last-child) の指定を外すことで調整できる*/
  content: "";
  display: block;
  margin: 16px 0;                /* 線と前後のコンテンツとの余白（お好みで調整） */
  border-bottom: 1px solid #DADADA; /* 緑色の線、太さや色はお好みで */
}


/* カテゴリーページのサイドバーの文字調整 */
.widget_work_all_categories li a {
  font-size: 0.8rem;  /* お好みで 0.85rem 〜 1rem の間で調整 */
}

.widget_work_all_categories .count {
  font-size: 0.85rem;
  color: #666; /* 任意：薄くしたい場合 */
}





/* タイトル下、更新日・著者表示を消す */
li.c-meta__item--modified {
  display: none!important;
}
li.c-meta__item--author {
  display: none!important;
}

/**カスタム投稿の記事一覧のカテゴリータグを非表示**/
body.hide-works-category .c-entry-summary__term {
    display: none !important;
}

/**カスタム投稿の記事一覧ページの説明を非表示↓**/
.post-type-archive-works .c-entry-summary__content {
    display: none !important;
}
.tax-works-all .c-entry-summary__content {
    display: none !important;
}

/**カスタム投稿の記事一覧ページの説明を非表示↑**/

/**カスタム投稿のSP版の記事一覧ページのタイトルの文字サイズを小さく**/
@media (max-width: 640px) {
  .post-type-archive-works .c-entry-summary__title {
    font-size: 16px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
	line-height: 1.3;
  }
}