@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.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*メインカラー　紺（C100　M80）
#003F98

(備忘　オレンジ #eb6100)


サブカラー　グリーン（C80　Y60）
#009B63

*/

/*1023px以下でロゴを消す*/
@media screen and (max-width: 1023px){
	img.site-logo-image{
		visibility: hidden;
	}
}

/*1023px以下でモバイル用のロゴ表示*/
@media screen and (max-width: 1023px){
	.logo-menu-button.menu-button{
		background-image: url(https://www.yamazoe-print.co.jp/testpage/wp-content/uploads/2022/02/yamazoe_mobile.jpg);
		background-size: auto 50px;
		background-position: center;
		background-repeat: no-repeat;
}
}


/*---------------------------------
ボックス（白抜き）の枠の色と太さを変える
--------------------------------*/
.blank-box {border-width: 2px; border-color: #CCCCCC;} /* 枠の太さと灰色の変更 */
	
.site-logo-image.header-site-logo-image{
width:1060px;
}

/*リンク画像にマウスが乗ると明るくなる*/
a:hover img{
opacity:0.8;
filter:alpha(opacity=80);
-ms-filter: “alpha( opacity=80 )”;
}


/*スライドショーの切り替え（PC/スマホ）*/
.pc {
display: block !important;
margin:10px;
}

.sp { display: none !important;}
/*
@media only screen and (max-width:750px) {
.pc { display: none !important;}
.sp { display: block !important;}
}
*/
/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
  display: none;
}

/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
  display: none;
}

/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
  display: none;
}

/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
  display: none;
}

/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
  display: none;
}

/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
  display: none;
}


#appeal {
	height:33vw;
margin-left:auto;
margin-right:auto;
} 

#navi .navi-in>.menu-header .sub-menu {
	background-color:#003F98;
}

.header-container{
  box-shadow: 0 6px 5px -3px rgba(0,0,0,0.24),
                0 6px 10px -3px rgba(0,0,0,0.18);
}

.header-container .navi {
	background-color:#003F98;
}

.header-container.fixed-header{
	background-color:#003F98;
}

#navi .navi-in a{
	color:white;
  transition:0.5s;
}

#navi .navi-in a:hover {
  background-color: rgba(214, 232, 232, 0.3);
}

/* □■-----------------------------------------------------
/ 『テーブル』
-----------------------------------------------------■□ */
/* ----- 見出し ----- */　
table tr th {
background: #003f98;
  color: white;
}


/* ----- ゼブラ ----- */

table tr:nth-child(odd) {
background: #def;  /* #fff; */
}

table th {
background: #003F98;
color: white;
}




/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
@media screen and (max-width:1023px) {
    /*　画面サイズが1023pxからはここを読み込む　*/
}

@media screen and (max-width:834px) {
    /*　画面サイズが834pxからはここを読み込む　*/
}
	
@media screen and (max-width:599px) {
    /*　画面サイズが599pxからはここを読み込む　*/
} 

@media screen and (max-width:480px) {
    /*　画面サイズが1023pxからはここを読み込む　*/

}






/* □■-----------------------------------------------------
/ 『見出し（h2）』
-----------------------------------------------------■□ */
.article h2 {
	/*
	font-size: 24px;
    padding: 12px;
    color: #333;
    background-color: #f8faff;
    border-top: 2px solid #3261ab;
    border-bottom: 2px solid #3261ab;
*/
	
  position: relative;
  color: #fff;
  background-color: #003F98;
    border-top: 2px solid #003F98;
	 border-bottom: 2px solid #003F98;
}

h2:after {
  position: absolute;
  bottom: -9px;
  left: 1em;
  width: 0;
  height: 0;
  content: '';
  border-width: 10px 10px 0 10px;
  border-style: solid;
  border-color: #003F98 transparent transparent transparent;
}
	


/* □■-----------------------------------------------------
/ 『見出し（h3）』
-----------------------------------------------------■□ */
/* ----- ベースのボーダー ----- */
.article h3 {
  margin-top: 40px;
  padding: 6px 10px;
  border: none;
border-bottom: solid 3px #003f98;
  position: relative;
}

/* ----- 2色目のボーダー ----- */
.article h3:after {
  position: absolute;
  content: " ";
  display: block;
border-bottom: solid 3px #009B63;
  bottom: -3px;
  left: -3px;
  width: 15%;
}

/* □■-----------------------------------------------------
/ 『見出し（h4）』
-----------------------------------------------------■□ */
.article h4 {
  border: none;
  position: relative;
  padding: 0 0 2px 32px;
border-bottom: 2px solid #003f98;
}

.article h4:before, .article h4:after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 12px;
  height: 12px;
  margin: auto;
}

/* ----- 2色目のレクタングル ----- */
.article h4:before {
border: 2px solid #003f98;
  top: -20px;
  left: 0px;
}

/* ----- ベースのレクタングル ----- */
.article h4:after {
border: 2px solid #009B63;
  top: -8px;
  left: 6px;
}

/* □■-----------------------------------------------------
/ 『見出し（h5）』
-----------------------------------------------------■□ */
.article h5 {
  position: relative;
  padding: 0 0 2px 32px;
  border-bottom: 1px solid #003f98;
}

/* ----- ワンポイント ----- */
.article h5:after {
  position: absolute;
  top: 5px;
  left: 4px;
  z-index: 2;
  content: '';
  width: 12px;
  height: 12px;
  background-color: #003f98;
  transform: rotate(45deg);
}

/* □■-----------------------------------------------------
/ 『見出し（h6）』
-----------------------------------------------------■□ */
.article h6 {
  border:none;
  border-bottom: 1px solid #003f98;
}

/* □■-----------------------------------------------------
/ 『サイドバーの見出し（h3）』　　投稿のh3と同じ
-----------------------------------------------------■□ */
/* ----- ベースのボーダー ----- */
.sidebar h3 {
  background: none;
  border-top: none;
border-bottom: solid 3px #003f98;
  padding: 4px 10px;
  color: #333435;
  position: relative;
}

/* ----- 2色目のボーダー ----- */
.sidebar h3:after {
  position: absolute;
  content: " ";
  display: block;
border-bottom: solid 3px #009B63;
  bottom: -3px;
  left: 0px;
  width: 85%;
}







/************************************
** お問い合わせフォームの入力
************************************/
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
select,
textarea,
.field {
  display: block;
  width: 100%;
  height: 45px;
  margin-bottom: 0;
  padding: 0 12px;
  border: 0;
  border-radius: 3px;
  background-color: #eff1f5;
  box-shadow: none;
  color: #5c6b80;
  font-size: 1em;
  vertical-align: middle;
  line-height: 45px;
  transition: background-color 0.24s ease-in-out;
}
textarea {
  max-width: 100%;
  min-height: 120px;
  line-height: 1.5em;
  padding: 0.5em;
  overflow: auto;
}
@media(max-width:500px) {
    .inquiry td,
    .inquiry th {
        display: block !important;
        width: 100% !important;
        border-top: none !important;
        -webkit-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
        box-sizing: border-box !important
    }
    .inquiry tr:first-child th {
        border-top: 1px solid #d7d7d7 !important
    }
    .inquiry .any,
    .inquiry .haveto {
        font-size: 10px
    }
}
.inquiry th {
    text-align: left;
    font-size: 14px;
    color: #444;
    padding-right: 5px;
    width: 30%;
    background: #f7f7f7;
    border: solid 1px #d7d7d7
}
.inquiry td {
    font-size: 13px;
    border: solid 1px #d7d7d7
}
.entry-content .inquiry tr,
.entry-content table {
    border: solid 1px #d7d7d7
}
.haveto {
    font-size: 8px;
    padding: 5px;
background: #EB5404;
    color: #fff;
    border-radius: 2px;
    margin-right: 5px;
    position: relative;
    bottom: 1px
}
.any {
    font-size: 8px;
    padding: 5px;
background: #003F98;
    color: #fff;
    border-radius: 2px;
    margin-right: 5px;
    position: relative;
    bottom: 1px
}
.verticallist .wpcf7-list-item {
    display: block
}
#formbtn {
    display: block;
    padding: 15px;
    width: 350px;
	background: #003f98;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    border-radius: 2px;
    margin: 25px auto 0
}
#formbtn:hover {
    background: #fff;
	color: #003f98;
	border: 2px solid #003f98
}
th {
    font-weight: 700;
    text-transform: uppercase;
    padding: 13px
}
td {
    border-top: 1px solid #ededed;
    padding: 12px
}
input,
select,
textarea {
    border: 1px solid #dfdfdf;
    letter-spacing: 1px;
    margin: 0;
    max-width: 100%;
    resize: none
}



/*その他と主な共通部分は省略*/
/*ボタンorange*/
a.btn--orange {
  color: #fff;
background-color: #eb5404;
}

a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}

a.btn-c {
font-size: 1.5rem;
  position: relative;
  padding: 1.5rem 2rem 1.5rem 2rem;
border-radius: 0.5rem;
}

a.btn-c i.fa {
  margin-right: 1rem;
}

/*ボタンblue*/

a.btn--blue {
  color: #fff;
  background-color: #28569a;
}

a.btn--blue:hover {
  color: #fff;
  background: #3967ab;
}

a.btn-c {
  font-size: 1.5rem;
  position: relative;
  padding: 1.5rem 2rem 1.5rem 2rem;
border-radius: 0.5rem;
}

a.btn-c i.fa {
  margin-right: 1rem;
}

/*ボタンgreen*/
a.btn--green {
color: #fff;
background-color: #009B63;
}

a.btn--green:hover {
	color: #fff;
background: #5c5;
}

a.btn-c {
font-size: 1.5rem;
  position: relative;
  padding: 1.5rem 2rem 1.5rem 2rem;
border-radius: 0.5rem;
}

a.btn-c i.fa {
  margin-right: 1rem;
}


/*必要ならばここにコードを書く*/
/*吹き出し見出しH2*/

a {
text-decoration: none;
color:#000;
}
a:hover { color: #003f98; }