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



body{
	background-color:#fff;
    line-height: 1.6;
	margin:auto;
    font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic'  
}
a {
	color:#333;
}


/*header*/
.logo {
  text-align: left;
}
/*固定ヘッダー*/
.header-container{
	background:rgba(255, 255, 255, 0.5);
}
/*固定ヘッダー枠に着いていた影を非表示*/
.fixed-header {
    box-shadow:none; 
}
.header-container-in.hlt-top-menu .logo-header img {
    max-height: 30px !important;
    height: auto;
    vertical-align: middle;
    margin: 1em 0 1em;
}


/*トップページ*/
h1.top-message{
    font-size: 3em;
    color: #A9C7C5;
    line-height: 1.6;
    font-weight: bold;
    text-align: center;
    margin: -1em 0 0;
}
.top-message p{
	font-size.5em;
    color: #414141;
    font-size: 1rem;
}
.top-sub-message{
	font-size:1em;
	font-weight:bold;
	text-align:center;
}
.top-sub-message h2{
	font-size:2.5em;
	font-weight:bold;
	border-left: none;
	background:#fff;
	margin:0 0 0;
}
.top-cta-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 15px;
    border-radius: 5px;
    width: 220px;
    font-weight: bold;
    transition: 0.3s;
    background-color: [object object];
    background-image: radial-gradient(circle at 100% 0%, rgba(94, 138, 243, 1) 15%, rgba(243, 61, 223, 1));
    padding: 17px;
    border-radius: 30px;
	margin: auto;
}
.top-cta-btn:hover {
  opacity: .5;
}
h2.top{
	font-size:2em;
	text-align:center;
	border-left: none;
	background:#fff;
	margin:5em 0 0;
}
p.top-text{
	text-align:center;
	font-size:15px;
}
.top-nayami{
	margin:0 5% 0;
	display:flex;
	justify-content:space-between;
}
.top-nayami .nayami-box {
    display: flex;
	margin:3em 0 0;
}
.top-nayami .nayami-box img{
	width:100px;
	margin-right:2em;
}
.top-nayami .nayami-box p{
	font-size:17px;
	font-weight:bold;
    display: flex;
    align-items: center;
}

.top-aican{
	margin:0 5% 0;
	display:flex;
	justify-content:space-between;
	width: 100%;
}
.top-aican .wp-block-ai{	
	margin:3em auto 0;
	background:#F4E8D8;
	padding:2em 1em;
	width: 33%;
	text-align: center;
}
.top-aican .wp-block-ai img{
	width:100px;
	margin:0 0 1em
}
.top-aican .wp-block-ai .wp-block-ai-subtitle{
	font-size:18px;
	font-weight:bold;
    align-items: center;
}
.top-aican .wp-block-ai .wp-block-ai-text{
	font-size:12px;
    color:#666;
	margin:-2em 0 0;
}



/*投稿ページAI生成タグ*/
    .box-point {
      background: #f7f7f7;
      border-left: 6px solid #4caf50;
      padding: 1em;
      margin: 1.5em 0;
      font-size: 1rem;
      line-height: 1.6;
    }
    .btn-action {
      display: inline-block;
      background: #ff5722;
      color: #fff;
      padding: 0.8em 1.2em;
      margin: 1em 0;
      text-decoration: none;
      border-radius: 5px;
      font-weight: bold;
      transition: 0.3s;
    }
    .btn-action:hover {
      background: #e64a19;
    }
    table {
      width: 100%;
      border-collapse: collapse;
      margin: 1em 0;
    }
    table th, table td {
      border: 1px solid #ccc;
      padding: 0.8em;
      text-align: left;
    }
    table th {
      background-color: #f0f0f0;
    }
    h2 {
      border-left: 5px solid #4caf50;
      padding-left: 0.5em;
      margin-top: 2em;
    }
    h3 {
      border-left: 3px solid #2196f3;
      padding-left: 0.5em;
    }






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

/*834px以下*/
@media screen and (max-width: 834px){


}

/*480px以下
---------------------------------------------*/
@media screen and (max-width: 480px){
	
	
	
/*トップページ*/
h2.top {
    margin: 2em 0 0;
}
p.top-text {
    text-align: left;
}
.top-nayami {
	margin:0 0 0;
	display: block;
	width:100%;
}
.top-nayami .nayami-box img {
    width: 70px;
	margin-right:3em;
}
.top-nayami .nayami-box p {
    font-size: 17px;
    font-weight: bold;
	width:auto;
}
.top-aican {
    margin: 0 2% 0;
    display: block;
	width: 100%;
}
.top-aican .wp-block-ai {
    margin: 1em auto 0;
    width: 100%;
	}	
	
	
	
	
	
	
	
}
