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

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

.wrap {
    width: 100%;
}
.wp-singular main, .widget_pc_text{    width: 96%;max-width:1200px;margin: 0 auto;}

.skin-grayish.front-top-page .content .main { padding: 20px 0px 0px 0px;}
.header-container, .main, .sidebar, .footer { background-color: transparent;}
.skin-grayish.front-top-page .content { background-color: transparent;}
body.custom-background { background-position: top center!important;}
.skin-grayish.front-top-page .header .header-in .logo-image { position: absolute; top: -60%;left:10%;}
.skin-grayish:not(.front-top-page) .header-in .logo-header img { width: auto;height: 100%; z-index: 9999; margin-left: 126px;}
.skin-grayish #navi-in { background-color: rgb(45 81 127 / 84%);height: 52px;}
.skin-grayish:not(.front-top-page) .header-container{ background-color: rgb(24 50 96 / 87%);}

.skin-grayish .copyright {color: #fff;}
.admin-panel { background-color: #183362;}
.logo-image { display: none;}
.home #header .logo-image { display: flow; position: absolute; top: 78px; left: 228px; width: 50%; max-width: 640px; min-width: 250px;}
.skin-grayish:not(.front-top-page) .navi-in>ul { height: 51px;}
.navi-in > ul {    justify-content: flex-end;}
.widget h2 {font-size: 28px;}
#menu-item-71 a:link{ color: #fedb03; background: #010f60; padding: 0px 5px 0px;order: 0px solid #fffc5b;}
.headbox{ width: 48%; position: absolute; top: 280px;left: 70px;}
.headbox li{width: 48%; float: left; margin: 0 1% 10px 0;}


.skin-grayish:not(.front-top-page) .navi-in>ul>li { padding-top: 3px;}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
.headbox{ width: 33%; position: absolute; top: 20px;left: 10px;}
.headbox li{width: 98%; float: left; margin: 0 1% 10px 0;}
.home .logo-image { display: flow; position: absolute; top: 62%; left: 71%; width: 50%; max-width: 500px; min-width: 250px;}	
	/*必要ならばここにコードを書く*/
}

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