@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*ヘッダー*/
.tagline{
font-size: 1em;
padding: .2em 1em;
}

/*アピールエリア*/
.appeal-content{
background-color: #eaeaea;
}

/*サイト名*/
span.site-name-text{
font-size: 1.8em;
color: #61718e;
transition: all 500ms;
}

/*エントリー部分*/
.entry-content{
margin: 0.2em auto 0 auto;
}

/*目次*/
.toc-list.open {
padding: 0 1.5em 0.5em;
}
ol.toc-list li{
list-style-type: none;
font-weight: bold;
}

/*text装飾*/
.marker-under {
background: linear-gradient(transparent 70%, #ff9 50%);
}
.red-under {
border-bottom:none;
background: linear-gradient(transparent 70%, #ffb5b5 50%);
}

/*2カラム*/
.box2{
width:100%;
}
.box2-left,
.box2-right{
width:50%;
float:left;
padding: 10px;
text-align: center;
}
.box2 h2{
text-align: left;
}
.cb{clear:both;}

/*テーブル*/
.tbhight{
line-height: 50px;
}
table th, table td{
font-size:0.9em;
}

/*サイドバー*/
aside{
padding:1.5em;
}

/*送信ボタンの装飾*/
.kaishi{
width: 60%;
background: lightseagreen;
line-height: 2em;
font-size: 1em;
color: #fff;
border-radius: 30px;
border: none;
outline: none;
cursor: pointer;
transition: all 500ms;
}
.riset{
width: 30%;
background: #b6b8bb;
line-height: 2em;
font-size: 1em;
color: #fff;
border-radius: 30px;
border: none;
outline: none;
cursor: pointer;
transition: all 500ms;
}

/*ラジオボタンの装飾*/
.cp_ipradio {
width: 90%;
text-align: left;
}
.cp_ipradio ul {
margin: 0.5rem 0.5rem 2rem 0.5rem;
padding: 0.5rem 1rem;
list-style: none;
border: 1px solid #cccccc;
}
.cp_ipradio .list_item {
margin: 0 0 0.5rem 0;
padding: 0;
}
.cp_ipradio label {
line-height: 135%;
position: relative;
margin: 0.5rem;
cursor: pointer;
transition: all 500ms;
}
.cp_ipradio .option-input {
position: relative;
margin: 0 1rem 0 0;
cursor: pointer;
}
.cp_ipradio .option-input:before {
position: absolute;
z-index: 1;
top: 0;
left: 0.125rem;
width: 0.75rem;
height: 0.75rem;
content: '';
-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
transition: transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75);
-webkit-transform: scale(0, 0);
transform: scale(0, 0);
border-radius: 50%;
background: #fda6a6;
}
.cp_ipradio .option-input:checked:before {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.cp_ipradio .option-input:after {
position: absolute;
top: -0.25rem;
left: -0.125rem;
width: 1rem;
height: 1rem;
content: '';
border: 2px solid #d4d4d4;
border-radius: 50%;
background: #fff;
}

/*基礎代謝の出力*/
.kisota{
background: #eff1f5;
border-radius: 5px;
margin: 4% 4% 0;
}
.kisota-a{
color:red;
font-size:1.4em;
}

/*SHARE MORE*/
.sns-share-buttons{
margin-top:-20px;
}
.related-entries{
margin-top: -70px;
}

/*Hoverアクションまとめ*/
span.site-name-text:hover{
opacity: .7;
}
.kaishi:hover,
.riset:hover{
background-color: #f5f8fa;
transition: all 0.7s;
color: #333;
}
.cp_ipradio label:hover{
border-bottom: 1px dotted #b6b8bb;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
}

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

/*768px以下*/
@media screen and (max-width: 768px){
#header .site-name-text{
font-size: 1.5em;
}
.box2-left,
.box2-right{
float:none;
width:100%;
}
.related-entries{
margin-top: -40px;
}
.sns-share.ss-col-6.ss-high-and-low-lc.bc-brand-color.sbc-hide.ss-top {
position: relative;
bottom: 20px;
width: 100%;
background: #eff1f5;
}
.sns-share.ss-top.ss-col-6 a{
margin: 0 0 5px;
}
}

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