@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){
  /*必要ならばここにコードを書く*/
}

.page .entry-title{
  display: none;
}
.page .date-tags {
display: none;
}

nav#navi, .menu-header .sub-menu{
	font-weight: bold;
	box-shadow:0 5px 15px -5px rgba(0,0,0,.8);
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
    border-bottom:5px solid #84DDE0 !important;/*線の太さ色*/
}

/*.menu-header .menu-item:hover{*/
/*	 border-bottom:5px solid #84DDE0 !important;*//*線の太さ色*/
/*	    transition: all .3s;*//*線が出てくる時間*/
/*}*/

.menu-header .menu-item:hover{
　　background-color: #F2F2F2;
　　transform: translateY(-2px);
　　box-shadow: 2px 2px 6px 0 #ccc;
　　transition: all 0.7s;
    border-bottom:5px solid #84DDE0 !important;/*線の太さ色*/
	transition: all .3s;/*線が出てくる時間*/
}

.sub-menu .menu-item:hover{
	border-bottom:none !important;
}

.menu-header .current-menu-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .item-label:hover {
  color: #5ebaba !important;
  transition: all .2s ease;
  border-bottom: none;	
}

.nomadBtn5 {
  color: #FFF !important;
  border-radius: 5px;
  padding: .7em 2em;
  display: inline-block;
  background: transparent linear-gradient(0deg, rgba(150,150,150) 0%, rgba(50,50,50,.6) 100%) 0% 0% no-repeat padding-box;
  text-decoration: none !important;
  margin: 15px 0;
}

.btn-square {
  display: inline-block;
  height: 100px;
  width: 300px;
  padding: 0.5em 1em;
  text-decoration: none;
  text-align: center;
display: flex;
justify-content: center;
align-items: center;
  background: #FC957A;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #FF4D00;
  border-radius: 3px;
}
.btn-square:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}

.sample01 {
    /*width: 400px;*/
    border: 1px solid #CCCCCC;
    padding: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
    overflow: hidden;
    zoom: 1;
}
.sample01 p {
    overflow: hidden;
    zoom: 1;
}
.sampleImg {
    float: left;
    margin: 0 10px 5px 0;
}


#contents {
    position: relative;
    width: 1000px; /* 任意 */
}
.block0 {
    position: absolute;
    top: 300px; /* #contents内の上から何pxか */
    left: 400px; /* #contents内の左から何pxか */
}
.block1 {
    position: absolute;
    top: 50px; /* #contents内の上から何pxか */
    left: 50px; /* #contents内の左から何pxか */
}
.block2 {
    position: absolute;
    top: 450px; /* #contents内の上から何pxか */
    left: 50px; /* #contents内の左から何pxか */
}
.block3 {
    position: absolute;
    top: 50px; /* #contents内の上から何pxか */
    left: 350px; /* #contents内の左から何pxか */
}
.block4 {
    position: absolute;
    top: 150px; /* #contents内の上から何pxか */
    left: 450px; /* #contents内の左から何pxか */
}
.block5 {
    position: absolute;
    top: 250px; /* #contents内の上から何pxか */
    left: 450px; /* #contents内の左から何pxか */
}

#area1 {
    position: relative;
    width: 300px; /* 任意 */
}
.block1 {
    position: absolute;
    top: 10px; /* #contents内の上から何pxか */
    left: 40px; /* #contents内の左から何pxか */
}
.block2 {
    position: absolute;
    top: 100px; /* #contents内の上から何pxか */
    left: 40px; /* #contents内の左から何pxか */
}

#area2 {
    position: relative;
    width: 300px; /* 任意 */
}
.block1 {
    position: absolute;
    top: 10px; /* #contents内の上から何pxか */
    left: 40px; /* #contents内の左から何pxか */
}
.block2 {
    position: absolute;
    top: 200px; /* #contents内の上から何pxか */
    left: 140px; /* #contents内の左から何pxか */
}
.block3 {
    position: absolute;
    top: 400px; /* #contents内の上から何pxか */
    left: 140px; /* #contents内の左から何pxか */
}