@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/

.shopbox{
	text-align:center;
}
.container {
  font-family: "Yu Gothic", YuGothic, Verdana, 'Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;
  text-align: center;
  padding-top: 0px;
}

/* ここから下がボタンのCSS　*/
.btn-animation-02 {
	display: inline-block;
	width: 200px;
	text-align: center;
	background-color: #f85c82;
	border: 2px solid #f85c82;
	font-size: 14px;
	color:#f85c82;
	text-decoration: none;
	font-weight: bold;
	padding: 10px 24px;
	border-radius: 4px;
	position: relative;
}
.btn-animation-02 span {
  position: relative;
  z-index: 1;
}
.btn-animation-02::before,
.btn-animation-02::after {
  content: "";
  display: block;
  background-color: #FFF;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
}
.btn-animation-02::before {
  left: 0;
}
.btn-animation-02::after {
  right: 0;
}
.btn-animation-02:hover:before,
.btn-animation-02:hover:after {
  width: 0;
  background-color: #FFF;
}
.btn-animation-02:hover {
  color: #FFF;
}
.main {
    padding: 0px 5% 10px;
}
.article h4{
    margin: 2.4em 0 2em;
    margin-left: auto;
    margin-right: auto;
    border-top: none;
    font-size: 1.5em;
    padding: 10px 10px;
    border-bottom: 2px solid #f85c82;
    width: 100%;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1420px以上*/
@media screen and (min-width: 1420px){
.wrap {
    width: 1280px;
}
.entry-content .cf{
    padding-top: 0px!important;
}
}

/*1420px以下*/
@media screen and (max-width: 1420px){
.wrap {
    width: auto;
}
}

/*1240px以下*/
@media screen and (max-width: 1240px){
.main {
    padding: 0px 4%;
}
}

/*1023px以下*/
@media screen and (max-width: 1023px){
		.sp-space{
		display:none;
	}
	.sp-block{
		flex-basis: 90%!important;
	}
}

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


/*480px以上*/
@media screen and (min-width: 481px){
	.sp-off{
		display:block;
	}
	.sp-on{
		display:none;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
	#shoptitle{
		font-size:1em;
		margin: 0 0 10px;
	}
	.sp-off{
		display:none;
	}
	.sp-on{
		display:block;
	}
	#main{
		padding: 0px 16px;
	}
	.leadtext br{
		display:none;
	}
	.leadtext{
		text-align:justify;
		font-size:0.8em;
	}
	p{
		font-size:0.8em;
	}
	#toc1{
		font-size:0.7em;
	}
.entry-content {
	padding-top: 0px;
	}
}