@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    fxnav-blog 0.0.5
Last up:    2023-09-28
*/

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


.article .red {
  font-size: 1.1em;
  color: #F00;
}
.article .green {
  font-size: 1.1em;
  color: #090;
}
.article .orange {
  font-size: 1.1em;
  color: #F60;
}
.article .marker{
  background-color:#FF9;
  font-size: 1.1em;
}



.official_arrow {
padding: 0 20px 20px 0;
font-size: 1.4em;
text-align: right;
	}
	


.official_arrow {
padding: 0 20px 20px 0;
font-size: 1.4em;
text-align: right;
	}
.official_arrow img, .left_arrow img { 
vertical-align: middle;
padding-right: 10px;
}


/* official-button
----------------------------------------------------*/

 /* official-button（Green） */
.official-button {
display: inline-block;
    background-color: #4FD32A;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#40D32A 0%), to(#43AA26 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -moz-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -ms-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -o-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfd255', endColorstr='#9ecb2d',GradientType=0 ); /* IE6-8 */
  border: 1px solid #6A8420;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -moz-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -ms-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -o-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  color: #fff;
  font: bold 25px "helvetica neue", helvetica, arial, sans-serif;
  line-height: 1.4em;
  padding: 22px 0 23px 0;
  text-align: center;
  text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.8);
  margin: 30px 0 70px 83px;
  width: 514px;
   }
 .official-button:hover {
    background-color: #B8F275;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#B8F275 0%), to(#A3D84E 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -moz-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -ms-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -o-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    cursor: pointer;
	 }
.official-button:active {
  background-color: #bfd255;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#bfd255 0%), to(#9ecb2d 50%));
  /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #5DBA56 0%, #469D4C 50%, #226522 51%, #5B9344 100%);
  background-image: -moz-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: -ms-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: -o-linear-gradient(top,#bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -ms-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -o-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
	}
a.official-button, .official-button:hover {
	 color: #fff;
	 text-decoration: none;
}







/* official-button（元のredボタン）
----------------------------------------------------*/
.official-redbutton {
display: inline-block;
  background-color: #ee432e;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ee432e 0%), to(#c63929 50%));
  /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
  background-image: -moz-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
  background-image: -ms-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
  background-image: -o-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
  background-image: linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
  border: 1px solid #951100;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
  -moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
  -ms-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
  -o-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
  box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
  color: #fff;
  font: bold 25px "helvetica neue", helvetica, arial, sans-serif;
  line-height: 1;
  padding: 22px 0 23px 0;
  text-align: center;
  text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.8);
margin: 30px 0 70px 65px;
width: 514px;
 
   }
 .official-redbutton:hover {
    background-color: #f37873;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f37873 0%), to(#db504d 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
    background-image: -moz-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
    background-image: -ms-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
    background-image: -o-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
    background-image: linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
    cursor: pointer;
	 }
.official-redbutton:active {
    background-color: #d43c28;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#d43c28 0%), to(#ad3224 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
    background-image: -moz-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
    background-image: -ms-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
    background-image: -o-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
    background-image: linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
    -ms-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
    -o-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
    box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4); }


a.official-redbutton, .official-redbutton a:hover {
	 color: #fff;
	 text-decoration: none;
 }


 /* 元Green btn */
.official-greenbutton {
    background-color: #4FD32A;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#40D32A 0%), to(#43AA26 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -moz-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -ms-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: -o-linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    background-image: linear-gradient(top, #40D32A 0%, #43AA26 50%, #0F9B00 50%, #0B6D00 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfd255', endColorstr='#9ecb2d',GradientType=0 ); /* IE6-8 */
  border: 1px solid #6A8420;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -moz-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -ms-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  -o-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4), 0 1px 3px #333333;
  color: #fff;
  font: bold 25px "helvetica neue", helvetica, arial, sans-serif;
  line-height: 1.4em;
  padding: 17px 0px 18px 0px;
  text-align: center;
  text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.8);
  margin: 30px 0 50px 65px;
  width: 514px;
   }
 .official-greenbutton:hover {
    background-color: #B8F275;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#B8F275 0%), to(#A3D84E 50%));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -moz-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -ms-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: -o-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    background-image: linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    cursor: pointer;
	 }
.official-greenbutton:active {
  background-color: #bfd255;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#bfd255 0%), to(#9ecb2d 50%));
  /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #5DBA56 0%, #469D4C 50%, #226522 51%, #5B9344 100%);
  background-image: -moz-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: -ms-linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: -o-linear-gradient(top,#bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
  background-image: linear-gradient(top, #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%);
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -ms-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    -o-box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
    box-shadow: inset 0px 0px 0px 1px rgba(169, 255, 102, 0.4);
	}
a.official-greenbutton, .official-greenbutton:hover {
	 color: #fff;
	 text-decoration: none;
	 padding: 0.5em 1em;
	 margin: 1em;
	   text-align: center;
}


#toc_container {
	margin: 0 auto;
}



.inlink a:link, .inlink-r a:link, .outlink a:link, .outlink-r a:link {
text-decoration: none;
}
.inlink a:visited, .inlink-r a:visited, .outlink a:visited, .outlink-r a:visited {
text-decoration: none;
}
.inlink a:hover, .inlink-r a:hover, .outlink a:hover, .outlink-r a:hover{
text-decoration: underline;
}
.inlink a:active, .inlink-r a:active, .outlink a:active, .outlink-r a:active{
text-decoration: none;
}
.inlink a:before {
  content: " \f0a9";
  font-family: FontAwesome;
  margin-left: 1em;
  padding-right: 0.5em;
}
.outlink a:before {
  content: " \f08e";
  font-family: FontAwesome;
  margin-left: 1em;
  padding-right: 0.5em;
}
.inlink-r, .outlink-r {
  text-align: right;
  padding-right: 1em;
}
.inlink-r a:after {
  content: " \f0a9";
  font-family: FontAwesome;
  text-align: right;
}
.outlink-r a:after {
  content: " \f08e";
  font-family: FontAwesome;
}


/* table
----------------------------------------------------*/

.tablepress tbody td,
.tablepress thead th,
.tablepress tfoot th {
	border: 1px solid #ccc;
}
/* tablepress管理画面でのカスタムCSS設定をこちらに---*/



/************************************
**  吹き出し部分
************************************/

.chatbox .talk{
	margin:10px 10px 30px 10px;
}
.chatbox .talk p{
	margin-left:0;
	margin-right:0;
}
.chatbox .talk .cont{
	margin:0 0 0 95px;
	padding:5px;
}
.chatbox .talk .cont-left{
	margin:0 95px 0 0;
	padding:5px;
}
.chatbox .talk .masa{
	background:url(./images/icon/masa.png) no-repeat left 18%;
	min-height:80px;
}
.chatbox .talk .masa-r{
	background:url(./images/icon/masa.png) no-repeat right 18%;
	min-height:80px;
}
.chatbox .talk .hide{
	background:url(./images/icon/hide.png) no-repeat left 18%;
	min-height:80px;
}
.chatbox .talk .hide-r{
	background:url(./images/icon/hide.png) no-repeat right 18%;
	min-height:80px;
}


/*MASA吹き出し*/
.chatbox .talk .masa .cont {
	position: relative;
	background: #ECEBC2;
	padding:1em;
	border: 4px solid #ECEBC2;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.chatbox .talk .masa .cont:after, .chatbox .talk .masa .cont:before {
	right: 100%;
	top: 25%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.chatbox .talk .masa .cont:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #ECEBC2;
	border-width: 10px;
	margin-top: -10px;
}
.chatbox .talk .masa .cont:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #ECEBC2;
	border-width: 16px;
	margin-top: -16px;
}


/*MASA吹き出し-左タイプ*/
.chatbox .talk .masa-r .cont-left {
	position: relative;
	background: #ECEBC2;
	padding:1em;
	border: 4px solid #ECEBC2;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.chatbox .talk .masa-r .cont-left:after, .chatbox .talk .masa-r .cont-left:before {
	left: 100%;
	top: 25%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.chatbox .talk .masa-r .cont-left:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #ECEBC2;
	border-width: 10px;
	margin-top: -10px;
}
.chatbox .talk .masa-r .cont-left:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #ECEBC2;
	border-width: 16px;
	margin-top: -16px;
}


/*ヒデ吹き出し*/
.chatbox .talk .hide .cont {
	position: relative;
	background: #D9EAFF;
	padding:1em;
	border: 4px solid #D9EAFF;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.chatbox .talk .hide .cont:after, .chatbox .talk .hide .cont:before {
	right: 100%;
	top: 25%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.chatbox .talk .hide .cont:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #D9EAFF;
	border-width: 10px;
	margin-top: -10px;
}
.chatbox .talk .hide .cont:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #D9EAFF;
	border-width: 16px;
	margin-top: -16px;
}


/*ヒデ吹き出し-左タイプ*/
.chatbox .talk .hide-r .cont-left {
	position: relative;
	background: #D9EAFF;
	padding:1em;
	border: 4px solid #D9EAFF;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.chatbox .talk .hide-r .cont-left:after, .chatbox .talk .hide-r .cont-left:before {
	left: 100%;
	top: 25%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.chatbox .talk .hide-r .cont-left:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #D9EAFF;
	border-width: 10px;
	margin-top: -10px;
}
.chatbox .talk .hide-r .cont-left:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #D9EAFF;
	border-width: 16px;
	margin-top: -16px;
}
.adpr {
	clear: both;
	position: relative;
	margin: 0 0 10px;
	padding: 3px 20px;
	background-image: linear-gradient( -45deg, #f5f5f5 25%, #fff 25%, #fff 50%, #f5f5f5 50%, #f5f5f5 75%, #fff 75%, #fff );
	background-size: 7px 7px;
	display: block;
}
.adpr span {
	background-image: url("/img/bg/iicon.svg");
	background-repeat: no-repeat;
	padding-left: 20px;
	background-size: 15px;
	background-position: 0% 50%;
	font-size: 0.9em;
}
/*ボタンにPRを付ける*/
/*DMMだけ*/
/*詳しくは公式サイトへ*/
.official_arrow a[href="/jump.php?id=dmm"]::after,
.official_arrow a[href="/jump.php?id=dmm_cfd"]::after {
	content: '【PR】';
}
/*公式サイト*/
a[href="/jump.php?id=dmm"].official-button::after,
a[href="/jump.php?id=dmm_cfd"].official-button::after {
    content: '【PR】';
}


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

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.official_arrow {
	font-size: 1.1em;
	}
.official-button, .official-greenbutton, a.official-greenbutton, .official-greenbutton:hover {
  max-width: 100%;
  margin: 10px auto 20px;
}

/* chatbox
----------------------------------------------------*/
.chatbox .talk{
	margin:10px 0px 30px 0px;
}
.chatbox .talk .cont{
	margin:0 0 0 60px;
}
.chatbox .talk .cont-left{
	margin:0 60px 0 0;
}
.chatbox .talk p {
	margin: 7px;
}
.chatbox .talk .masa .cont, .chatbox .talk .masa-r .cont-left, .chatbox .talk .hide .cont, .chatbox .talk .hide-r .cont-left {
	padding: 8px;
}


.chatbox .talk .masa{
	background:url(./images/icon/masa_m.png) no-repeat left 18%;
	min-height:56px;
}
.chatbox .talk .masa-r{
	background:url(./images/icon/masa_m.png) no-repeat right 18%;
	min-height:56px;
}
.chatbox .talk .hide{
	background:url(./images/icon/hide_m.png) no-repeat left 18%;
	min-height:58px;
}
.chatbox .talk .hide-r{
	background:url(./images/icon/hide_m.png) no-repeat right 18%;
	min-height:58px;
}
.adpr {
	line-height: 1.2;
	padding: 7px;
	font-size: 0.8em;
}
.adpr span {
	background-size: 13px;
}

}