@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}





/********* HTML再定義 ****/

.content,
.content-in {
margin-bottom: 0 !important;
}
article,
.article,
section{
margin-top: 0;
margin-bottom: 0 !important;
padding-top: 0;
padding-bottom: 0;
}
main,
.main {
margin-top: 0;
margin-bottom: 0 !important;
padding-top: 0;
padding-bottom: 0;
}

section {
padding: 0;
margin: 0;
margin-bottom: 0;
}
.entry-content {
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}

.mincho {
	font-family:"MS Serif", "New York", serif;
}


/********* 全体 ***********************************************/


.breadcrumb {
max-width: 1280px;
}
@media only screen and (max-width: 1279px) {
.breadcrumb {
padding: 0 30px!important;
}
}
@media only screen and (max-width: 1023px) {
.breadcrumb {
padding: 0 16px!important;
}
}
@media only screen and (max-width: 640px) {
.breadcrumb {
display: none;
}
}


.eye-catch-wrap {
border: 5px solid #F2F2F2;
}
.eye-catch-wrap img,
.eye-catch-wrap figure {
display: block;
width: 100%;
max-width: inherit;
}
@media screen and (max-width: 640px){
.eye-catch-wrap {
border: 3px solid #F2F2F2;
}
}
.eye-catch {
display: block;
margin: 0 auto;
max-width: 100%;
}
.eye-catch-image {
display: block;
    width: 100%;
    height: auto;
	max-width: none;
    padding: 0;
    margin: 0;
    border: none;
    vertical-align:bottom

}



/*グローバルメニュー*/
    .navi {
	margin-bottom: 16px;
    }
@media only screen and (max-width: 1280px) {
.navi-in {
    padding: 0 30px;
}
}
    .navi-in > ul {
        margin: 0;
        padding: 0;
    }
    .navi-in > ul li {
        font-family: "MS Serif", "New York", serif;
        margin: 0;
        padding: 5px 0;
        font-weight: bold;
        letter-spacing: 1px;
        height: auto;
        line-height: 1.0;
        border-left: 1px solid #999;
        width: calc(100% / 7) !important;
    }
    .navi-in > ul li ul li {
        width: 400px !important;
    }
    .navi-in > ul li.last {
        border-right: 1px solid #999 !important;
    }


@media only screen and (max-width: 1280px) {
.navi-in > ul li {
    width: 100px;
    }
}

	
	/*サイドバー*/
    h3.side_title {
        border-left: 5px solid #000;
        padding: 1px;
        padding-left: 7px;
        background: none;
        margin: 0;
        margin-bottom: 0;
    }

    .box_side {
        border: 1px solid #333;
    }

    .box_side .inner {
        padding: 24px;
    }

    @media only screen and (max-width: 1023px) {
        .box_side .inner {
            padding: 16px;
        }
    }

    .sidemap {
        position: relative;
        padding-bottom: 70%;
        height: 0;
        overflow: hidden;
    }

    .sidemap iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .bt_red {
        display: inline-block;
        font-weight: bold;
    }

    .bt_red a {
        display: block;
        text-decoration: none;
        padding: 5px 30px;
        text-align: center;
        font-weight: bold;
        color: #FFF;
        background-color: #F00;
        border-radius: 20px;
    }

    .bt_red a:hover {
        text-decoration: none !important;
        transition: all 0.3s;
        opacity: 0.7;
    }
	
	
/********* ヘッダー ***********************************************/


.header-container {
padding: 0;
margin: 0 auto;
}
.header-container-in {
margin: 0;
padding: 0 0;
}
@media screen and (max-width: 1023px) {
.header-container {
display: none;
}
}


.head_flex {
display: flex;
max-width: 1280px;
margin: 0 auto;
padding: 16px 0;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
}
@media screen and (max-width: 1280px) {
.head_flex {
padding: 16px 30px;
}
}
.head_flex_left {
display: block;
max-width: 320px;
width: 30%;
}
.head_flex_right{
display: block;
width: 60%;
}
haeder {
padding: 0;
margin: 0;
}
.header {
display: block;
padding: 0 !important;
margin: 0 !important;
}


.header-in {
    display: block;
float: none;
margin: 0 !important;
padding: 0 0 !important;
width: 100% !important;
}
.logo-image {
    padding: 0 0;
}

@media only screen and (max-width: 834px) {
.header {
padding: 1em 1em;
}
}

.site-logo-image.header-site-logo-image {
display: block;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: auto !important;
}


/************************************
** ヘッダーレイアウト ヘッダー固定時崩れ防止
************************************/
.header-container-in.hlt-top-menu {
  display: block;
  margin: 0 auto;
  width: 100%;
}


.site-name-text-link {
    padding: 0 0;
}




ul.header_bt { 
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
}
ul.header_bt li {
list-style: none;
display: inline-block;
margin: 0;
padding: 0;
margin-left: 16px;
line-height: 100%;
white-space: nowrap;
}

ul.header_bt li .imagecenter00 {
max-height: 1.15em;
width: auto;
}
ul.header_bt li a {
  padding: 0 0;
  padding-left: 0.2em;
  display: block;
}
ul.header_bt li a:hover { 
color: #479557;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

ul.header_bt li a:hover { 
color: #479557;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}


.bt_mailimg {
display: block;
max-height: 80px;
width: auto;
}

.header_bt a {
text-decoration: none !important;
color: #135;
font-weight: bold;
}


ul.header_bt li i {
  font-weight: 900;
  margin-right: 0.2em;
  color: #F9B54F;
}

.logo-menu-button img {
    max-height: 42px;
    display: block;
    margin: 8px auto;
    width: auto;
}

	
/********* メイン タイトル ***********************************************/

#top_main {
    position: relative;
	width: 100%;
	display: block;
}
@media only screen and (max-width: 1023px) {
#top_main {
margin-top: 60px;
}
}


.title_back {
    background-color: #f5f5f5;
}
#title {
display: block;
    position: relative;
    padding-top: 10%;
    padding-bottom: 13%;
    height: 0;
    overflow: hidden;
	margin-bottom: 20px;
    background-color: #f5f5f5;
	background: url(../../uploads/2026/03/title_back.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: min(1280px, 100%);
	box-shadow: 0 5px 10px rgba(0,0,0,0.3);
}
.title {
display: block;
    position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 10px;
	text-align: left;
	color: #FFF;
	font-weight: bold;
	text-shadow: 0 0 2px rgba(0,0,0,1), 2px 2px 5px rgba(0,0,0,1);
}

@media only screen and (max-width: 1279px) {
.title {
	padding: 0 20px;
}
}

@media only screen and (max-width: 1023px) {
#title {
margin-top: 60px;
    padding-top: 10%;
    padding-bottom: 10%;
}
.title {
	padding: 0 16px;
}
}
@media only screen and (max-width: 640px) {
#title {
    padding-top: 15%;
    padding-bottom: 15%;
}
}

/********* フッター ***********************************************/

.footer {
    background: #EEE;
    margin-top: 0;
    padding: 40px 0;
}
.footer-bottom {
    margin-top: 0;
    padding: 0;
}

@media only screen and (max-width: 1023px) {
.footer {
    padding: 24px 0;
}
.navi-footer {
    display: none;
}
}

/********* サイドメニュー ***********************************************/

.sidebar {
    margin-bottom: 40px;
}
@media screen and (max-width: 1279px) {
.main, .sidebar, .sidebar-left .main, .sidebar-left .sidebar {
margin: 0 0;
}
}
@media only screen and (max-width: 1023px) {
.sidebar {
margin-bottom: 24px;
}
}

@media screen and (max-width: 834px) {
main.main, div.sidebar {
padding: 0 0;
margin: 0 0;
}
.sidebar {
margin-bottom: 24px;
}
}

/* サイドバー用グローバルメニュー */
.sidebar-global-menu {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  overflow: hidden;
}

/* ul */
.sidebar-global-menu .menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* li */
.sidebar-global-menu .menu-item {
  border-bottom: 1px solid #eee;
}

.sidebar-global-menu .menu-item:last-child {
  border-bottom: none;
}

/* リンク */
.sidebar-global-menu .menu-item a {
  display: block;
  padding: 12px 16px;
  color: #333;
  text-decoration: none;
  font-size: 14px;
  transition: 0.25s;
}

/* hover */
.sidebar-global-menu .menu-item a:hover {
  background: #f7f7f7;
  color: #e60023;
  padding-left: 20px;
}


.grid_sidebn {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 24px;
}
@media only screen and (max-width: 1023px) {
.grid_sidebn {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
}
}
.grid_sidebnbox {
    grid-column: span 12 / span 12;
}
@media only screen and (max-width: 1023px) {

.grid_sidebnbox {
    grid-column: span 6 / span 6;
}
}
/********* 見出し ***********************************************/

.cp_h1title{
	position: relative;
	overflow: hidden;
    padding-bottom: 8px !important;
    margin-bottom: 24px !important;
}
.cp_h1title::before,
.cp_h1title::after{
	position: absolute;
	content: "";
	bottom: 0;
	width: 100%;
}
.cp_h1title:before{
	border-bottom: 4px solid #555;/*文字下のライン*/
}
.cp_h1title:after{
	border-bottom: 4px solid #CCC;/*文字以外のライン*/
}
@media only screen and (max-width: 640px) {
.cp_h1title{
    margin-bottom: 16px !important;
}
}

.title_stick {
    border: none;
    background: none;
    padding: 0;
    margin-bottom: 8px !important;
}
@media only screen and (max-width: 640px) {
.title_stick {
    margin-bottom: 4px !important;
}
}


.midashi {
border-bottom: 3px solid #000;
padding-bottom: 4px;
}

.midashi02 {
color: #C60;
border-bottom: 1px dotted #555;
padding-bottom: 4px;
}

.midashi h5 {
border: none !important;
margin-bottom: 0;
padding-left: 0;
margin-left: 0;
}

.midashi_side {
    margin: 0 !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    padding-bottom: 8px !important;
    background: none !important;
    border-bottom: 1px solid #000;
    font-weight: 600;
    font-family: "Hiragino Mincho ProN", "Yu Mincho", "MS Mincho", serif;
}
@media screen and (max-width: 640px){
.midashi_side {
    margin-bottom: 8px !important;
    padding-bottom: 4px !important;
}
}


.midashi_line {
border-bottom: 1px solid #000;
padding-bottom: 2px;
}
    
    


h3.submenutitle {
	font-family:"MS Serif", "New York", serif;
	border-left: 5px solid #000 !important;
	padding: 1px;
	padding-left: 7px !important;
}


ul.submenu {
	margin: 0;
	padding: 0;
}
ul.submenu li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.submenu li a {
	display: block;
	margin: 0;
	padding: 12px;
	border-left: 5px solid #135;
	background-color: #F5F5F5;
	border-bottom: 1px dotted #999;
	text-decoration: none;
}
ul.submenu li a:hover {
	text-decoration: none;
	background-color: #DEF;
}



/********* table ***********************************************/

.sp_scroll {
  margin-bottom: 0!important;

}
@media screen and (max-width: 640px) {
  .sp_scroll {
    overflow-x: scroll;
  }
.sp_scroll table {
    width: 100%;
	min-width: 640px;
  }
}
  
.sp_scrollimg {
display: block;
	max-width: 100%;
	margin: 0;
  }
@media screen and (max-width: 640px) {
.sp_scroll .sp_scrollimg {
    width: 100%;
	font-size: 100%;
	margin: 0;
}
}
p.sp_scrolltxt {
display: none;
}
.yazirusi {
display: none;
}
@media only screen and (max-width: 640px) {
p.sp_scrolltxt {
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
  color: #F00;
}
    .yazirusi {
display: inline-block;
        margin-left: 4px;
        width: calc(100% - 5em);
        height: 6px;
        border-bottom: 1px solid #999;
        border-right: 1px solid #999;
        transform: skew(45deg);
}
}

    
    
/********* お知らせ ***********************************************/


ul.top_news {
	margin: 0;
	padding: 0;
	border-top: 1px dotted #CCC;
}
ul.top_news li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 8px 8px;
	border-bottom: 1px dotted #CCC;
}
ul.top_news li p {
	margin: 0;
	padding: 0;
}
ul.top_news li p span {
}
ul.top_news li p a {
	margin: 0;
	padding: 0;
	color: #000;
	text-decoration: none;
}


ul.top_news li p a:hover {
	text-decoration: underline;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

@media screen and (max-width: 640px){
ul.top_news {
	margin-bottom: 0;
}
}

table.table_top_news {
	table-layout: fixed;
	width: 100%;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
}
table.table_top_news tr, table.table_top_news th, table.table_top_news td {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
}
table.table_top_news th, table.table_top_news td {
	border-collapse: collapse;
	border: none;
	background: none;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
table.table_top_news th {
	color: #555;
	width: 10em;
}
table.table_top_news td p {
    display: inline-block;
}

@media screen and (max-width: 640px){
table.table_top_news th {
	display: block;
	width: auto;
	margin-bottom: 8px;
}
    table.table_top_news th p {
    display: inline-block !important;
}
table.table_top_news td {
	display: block;
	margin-bottom: 0;
}
table.table_top_news td {
	line-height: 130%;
}
}

.tag_news {
	display: inline-block;
	margin: 0 8px;
	padding: 2px;
	padding-bottom: 0;
	font-size: 80%;
	width: 5em;
	text-align: center;
	background-color: #F00 !important;
	color: #FFF !important;
	line-height: 1.2;
}
.tag_category {
	display: inline-block;
	margin: 0 0;
	margin-right: 4px;
	padding: 2px;
	padding-bottom: 0;
	font-size: 80%;
	width: 5em;
	text-align: center;
	border: 1px solid #000;
	color: #000 !important;
	line-height: 1.2;
}



ul.list_maru {
  margin: 0;
  padding: 0;
}
ul.list_maru li {
  position: relative;
  list-style: none;
  text-align: justify;
  margin: 0;
  padding: 0;
  padding-left: 1em;
}
ul.list_maru.inline li {
display: inline-block;
margin-right: 1em;
}
ul.list_maru.inline li:last-child {
margin-right: 0;
}
ul.list_maru li:before {
  position: absolute;
  content: "●";
  margin-left: -1.0em;
}




ol.list_number {
list-style-type: none;
margin: 0;
padding: 0;
counter-reset: number;/* カウンターを初期化 */
}
ol.list_number li {
list-style: none;
position: relative;
margin: 0;
padding: 0;
padding-left: 1.5em;
}
/* beforeでカウンターを作成 */
ol.list_number li::before {
position: absolute;
content: counter(number);
counter-increment: number;
padding: 0.2em 0.2em;
margin-left: -1.6em;
margin-top: 0.3em;
font-size: 90%;
line-height: 1.0;
color: #000;
}
/* afterで○を作る */
ol.list_number li::after {
content: '';
/* 配置を調整 */
position: absolute;
display: block;
top: 0.29em;
left: -0.035em;
/* ○を作る */
width: 1em;
height: 1em;
border: 1px solid #000;
border-radius: 50%;
}


ol.list_suuji {
  margin: 0;
  padding: 0;
}
ol.list_suuji li {
margin-left: 1.5em;
}
ul.list_line {
  margin: 0;
  padding: 0;
}

ul.list_line li {
  position: relative;
  list-style: none;
  text-align: justify;
  margin: 0;
  padding: 8px 1em;
  border-bottom: 1px dotted #555;
}


ul.list_dott {
  margin: 0;
  padding: 0;
}

ul.list_dott li {
  position: relative;
  list-style: none;
  text-align: justify;
  margin: 0;
  padding: 0;
  padding-left: 1em;
}
ul.list_dott li:before {
  position: absolute;
  content: "・";
  margin-left: -1.0em;
}

ul.list_kome {
  margin: 0;
  padding: 0;
}
ul.list_kome li {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  padding-left: 1.0em;
}
ul.list_kome li:before {
  position: absolute;
  content: "※";
  margin-left: -1.0em;
}

ul.list_kome_red {
  margin: 0;
  padding: 0;
}
ul.list_kome_red li {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  padding-left: 1.0em;
}
ul.list_kome_red li:before {
  position: absolute;
  content: "※";
  margin-left: -1.0em;
color: #F00;
}



.box_shadow {
  text-box-trim: trim-both;
	display: block;
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	padding: 24px;
}
@media only screen and (max-width: 640px) {
.box_shadow {
	padding: 16px;
}
}

.box_gray {
background-color: #F5F5F5;
padding: 24px;
}
@media only screen and (max-width: 640px) {
.box_gray {
padding: 16px;
}
}

.bt_black {
	display: block;
	font-size: 90%;
	
}
@media only screen and (max-width: 640px) {
.bt_black {
	font-size: 85%;
	
}
}
.bt_black a {
	display: block;
	text-align: center;
	text-decoration: none;
	padding: 4px 1px;
	color: #FFF;
	background-color: #666;
	
}




.grid_12 {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 24px;
    margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
.grid_12 {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
}
}
.grid_doublebox_pconly {
    grid-column: span 12 / span 12;
}
.grid_doublebox {
    grid-column: span 6 / span 6;
}
.grid_doublebox_only {
    grid-column: span 6 / span 6;
}
.grid_triplebox {
    grid-column: span 4 / span 4;
}
.grid_triplebox02 {
    grid-column: span 4 / span 4;
}
.grid_fourbox {
    grid-column: span 3 / span 3;
}
@media only screen and (max-width: 640px) {

.grid_doublebox_pconly {
    grid-column: span 6 / span 6;
}
.grid_doublebox {
    grid-column: span 12 / span 12;
}
.grid_triplebox {
    grid-column: span 12 / span 12;
}
.grid_triplebox02 {
    grid-column: span 6 / span 6;
}
.grid_fourbox {
    grid-column: span 6 / span 6;
}
}

.grid_double_txt_left {
    grid-column: span 6 / span 6;
}
.grid_double_pic_right {
    grid-column: span 6 / span 6;
}
@media only screen and (max-width: 640px) {
.grid_double_txt_left {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
    grid-row-start: 2;
}
.grid_double_pic_right {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
    grid-row-start: 1;
}
}





/* ================================
   iPhone入力時のズレ修正CSS
   既存のCSSに追加してください
================================ */

/* 1. iPhoneの自動ズームを防止（最重要） */
input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
    font-size: 16px !important; /* 16px以上で自動ズームを防止 */
}

/* 2. ビューポート設定（HTMLのheadタグ内に追加） */
/* 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
を以下に変更：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
*/



/* 4. フォーム入力時のスクロール改善 */
@media screen and (max-width: 834px) {
    input:focus,
    select:focus,
    textarea:focus {
        /* フォーカス時の挙動を改善 */
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
    }
    
    /* テーブルセルの高さを最適化 */
    table.form_table td {
        padding: 12px 0; /* 16pxから12pxに調整 */
        min-height: auto;
    }
}

/* 5. selectボックスの高さを明示的に指定 */
@media screen and (max-width: 834px) {
    select.wpcf7-form-control {
        height: 44px; /* タップしやすい高さ */
        padding: 8px;
        font-size: 16px !important;
    }
}

/* 6. textareaの調整 */
@media screen and (max-width: 834px) {
    textarea.wpcf7-form-control {
        min-height: 120px;
        font-size: 16px !important;
        padding: 8px;
        resize: vertical; /* 縦方向のみリサイズ可能 */
    }
}

/* 7. 送信ボタンがキーボードで隠れないように */
@media screen and (max-width: 834px) {
    .btn.btn-primary {
        margin-top: 20px;
        margin-bottom: 30px; /* 下部に余白を追加 */
    }
}

/* 8. フォーカス時のスクロール位置を固定 */
@media screen and (max-width: 834px) {
    .wpcf7-form {
        position: relative;
        padding-bottom: 50px; /* フォーム下部に余白 */
    }
}
.wpcf7-list-item {
        margin: 0;
    margin-right: 8px;
    }
.wpcf7-list-item.last {
    margin-right: 0;
    }
/* 9. チェックボックスのタップ領域を拡大 */
@media screen and (max-width: 834px) {
    .wpcf7-list-item {
        margin: 0;
        padding: 0 0;
    }
    
    .wpcf7-list-item label {
        display: inline-block;
        padding: 8px;
        cursor: pointer;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
    }
    
    .wpcf7-list-item input[type="checkbox"] {
        width: 20px;
        height: 20px;
        margin-right: 8px;
        vertical-align: middle;
    }
}

/* 10. iOS Safariの入力フィールド装飾を調整 */
@media screen and (max-width: 834px) {
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    select,
    textarea {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border-radius: 4px;
        border: 1px solid #ccc;
        padding: 10px;
        background-color: #fff;
    }
    
    /* selectボックスに矢印を追加 */
    select {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%23333' d='M0 0l6 8 6-8z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 12px center;
        background-size: 12px;
        padding-right: 32px !important;
    }
}

/* 11. プレースホルダーのフォントサイズも統一 */
@media screen and (max-width: 834px) {
    input::placeholder,
    textarea::placeholder {
        font-size: 16px !important;
        color: #999;
    }
}

/* 12. フォーム全体のパディング調整 */
@media screen and (max-width: 834px) {
    .box_gray {
        padding: 12px 16px; /* 16pxから12pxに調整 */
    }
}

/* 13. iOS SafariのオートコンプリートUIの調整 */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

/* 14. キーボード表示時のビューポート高さ対応 */
@media screen and (max-width: 834px) {
    @supports (-webkit-touch-callout: none) {
        /* iOS Safari専用 */
        body {
            min-height: -webkit-fill-available;
        }
    }
}