/*
Theme Name: Buyma
Theme URI: localhost/wordpress/
Description: sample-page
Author: daichiiyanaga
Author URI: localhost/wordpress/
Version: 1.0.0
*/


@charset "utf-8";
/* CSS Document */

/* reset CSS */
html, 
html * {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

/* 上に戻るボタン */
.pagetop {
	color: #fff;
	background-color: rgba(0,0,0,0.3);
	text-decoration: none;
	display: none;
	position: fixed;
	bottom: 0.6em;
	right: 0.6em;
	font-size: 1rem;
	width: 2rem;
	height: 2rem;
	line-height: 2rem;
	border-radius: 2rem;
	text-align: center;
	cursor: pointer;
}

.pagetop:hover {
	color: #fff !important;
	background-color: #950000;
	text-decoration: none;
}


body {
	font-family: 'Kosugi Maru',sans-serif;
	margin-left: auto;
	margin-right: auto;
	background-size: cover;
	background-attachment: fixed;

	background-blend-mode:lighten;
  height:100vh;
　　　　      background-color: #edfeff;
    background-image: linear-gradient(
90deg
, rgba(25, 129, 247, 0.1) 50%, transparent 50%), linear-gradient(
90deg
, rgba(25, 129, 247, 0.2) 50%, transparent 50%), linear-gradient(
90deg
, rgba(25, 129, 247, 0.2) 50%, transparent 50%), linear-gradient(
90deg
, rgba(25, 129, 247, 0.1) 50%, transparent 50%);
    background-size: 20px, 30px, 40px, 50px;

}

main{
	text-align: center;
	margin: 0 auto;
}

img{
	width:100%;
	height:auto;
	vertical-align:middle;
}

.bg{
	box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
	width: 100%;
}

a{
	text-decoration: none;
	color: #fff;
	cursor: pointer;
}

a:hover{
	opacity: 0.8;
}


.col{
	background-color: #256a71;
	color: #ffffff;
	padding: 1em;
	font-size: 0.7em;
	font-weight: normal;
	line-height: 2em;
}

.accbox2 span{
	color: red;
	font-weight:bold ;
}

/*追従ボタン*/
.fixed_btn
{
  position: fixed;
  bottom: 3.5em; 
  right: 5px;
  padding: 0px;
  border: none;
  background-color:rgba(0,0,0,0);
  z-index: 100;
  max-width: 100px;
}

.fixed_btn:hover
{
  position: fixed;
  bottom: 3.3em; 
  right: 5px;
  padding: 0px;
  border: none;
  background-color:rgba(0,0,0,0);
}

/* アニメーションボタン */
.cv_btn {
	margin: 0 auto;
  }
  .cv_btn img {
	animation: anime1 0.5s ease 0s infinite alternate;
	transform-origin:center;
  }
  @keyframes anime1 {
	from {
	  transform: scale(0.9,0.9);
	}
	to {
	  transform: scale(1,1);
	}
  }

/* ボタン */
.row1{
	background-color: white;
	padding: 1em;
}

.btn1 img {
	position: relative;
	width: 100%;
    max-width: 563px;
	height: auto;
}

.fa-arrow-alt-circle-up:before {
    content: "\f35b";
}

/*ボックス全体2*/
.accbox2 {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
  }
  
  /*ラベル*/
  .accbox2 label {
	display: block;
	padding : 15px;
	color: #fff;
	font-weight: normal;
	font-size: medium;
	background: #4b6efe;
	cursor :pointer;
	transition: all 0.5s;
  }
  
  /*アイコンを表示*/
  .accbox2 label:before {
	content: '\f107';
	font-family: 'FontAwesome';
	padding-right: 0.5em;
	color: #ffffff;
	float: right;
  }
  
  /*ラベルホバー時*/
  .accbox2 label:hover {
	color: #333333;
	background :#efecd0;
  }
  
  /*チェックは隠す*/
  .accbox2 input {
	display: none;
  }
  
  /*中身を非表示にしておく*/
  .accbox2 .accshow {
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.8s;
  }
  
  /*クリックで中身表示*/
  .cssacc:checked + label + .accshow {
	height: auto;
	padding: 5px;
	color: #333333;
	background: #ffffff;
	opacity: 1;
  }
  
  .accbox2 .accshow p {
	margin: 15px 10px}
  
  /*アイコンを入れ替える*/
  .cssacc:checked + label:before {
	content: '\f106';
	color: #333333;
  }



/* for tablet */
@media (min-width: 768px){

body{
	max-width:778px;
}

main{
	width: 800px;
	text-align: center;
	margin: 0 auto;
}

.col{
	font-size: 14px;
}

.row1{
	padding: 2em;
}

.accbox2 {
	max-width: 756px;
  }

.fixed_btn
  {
	position: fixed;
	bottom: 7em; 
	right: 6px;
	padding: 0px;
	border: none;
	background-color:rgba(0,0,0,0);
	z-index: 100;
	max-width: 120px;
  }
  
.fixed_btn:hover
  {
	position: fixed;
	bottom: 6.5em; 
	right: 6px;
	padding: 0px;
	border: none;
	background-color:rgba(0,0,0,0);
  }
  
.pagetop {
	bottom: 1em;
	right: 1em;
	font-size: 1.5rem;
	width: 3rem;
	height: 3rem;
	line-height: 3rem;
	border-radius: 3rem;
}
}
/* for PC */
@media (min-width: 1024px){

body{
	max-width:1200px;
}


}