@charset "utf-8";
/*
html5doctor.com Reset Stylesheet
キラキラショップ
http://kanmusu.chu.jp/
*/


/*PC用**********/
* {
	padding:0;
	margin:0;
}
 html, body, div, span, object, iframe,, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
 margin:0;
 padding:0;
 border:0;
 outline:0;
 font-size:90%;
 vertical-align:baseline;
 background:transparent;
 font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
body {
	line-height:100%;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section {
	display:block;
}
nav ul {
	list-style:none;
}
blockquote, q {
	quotes:none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
	content:none;
}
a {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	color:#333;
	text-decoration:none;
}
ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}
li {
	list-style-type:none;
}
img {
	max-width:100%;
}
mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
hr {
	display:block;
	height:1px;
	border:0;
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}
.clearfix:after {
	content:"";
	display:block;
	clear:both;
}
/* PagiNation
--------------------------- */
.pagiNation {
	bottom: 30px;
	left: 0;
	width: 100%;
	height: 15px;
	text-align: center;
	position: fixed; /* absolute or fixed */
	z-index: 110; /* 非表示にする場合は「90」以下に */
	visibility: visible; /* 非表示にする場合は「hidden」に */
}
.pagiNation a {
	margin: 0 5px;
	width: 20px;
	height: 20px;
	display: inline-block;
	overflow: hidden;
	background: #000;
}
.pagiNation a.pnActive {
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
}
/* Wrapper
--------------------------- */
#wrapper {
	width:480px;
	margin:0 auto!important;
	text-align: left;
}
h1 {
	font-size:20px;
	font-weight:normal;
	display:block;
	text-align:center;
	position:relative;
	padding:0 0 10px;
}
h1 span {
	display:block;
	font-size:12px;
	margin-bottom:5px;
	color:#333;
}
.footer_box {
	position:fixed;
	bottom:0;
}
.bnr li {
	width:33%;
	display:block;
	float:left;
	text-align:center;
}

.bnr img{
	display:block;
}

.bnr li a{
	font-size:12px;
}

.kboard-default-poweredby {
	display:none;
}
header {
	position:relative;
}
.tit {
	position: relative;
	background: #ff9900;
	padding:10px;
	text-align:center;
	color:#fff;
	font-size:120%;
}
.mitubox {
	margin-bottom:20px;
	background: url(./img/pattern02_yellow02.jpg);
	width:90%;
	margin:0 auto;
}
.mitubox dl {
	padding:10px;
	display:block;
}
.mitubox dt {
	float:left;
	width:30%;
	display:block;
}
.w {
	background:#fff!important;
}
.mitubox input {
	border:solid 1px #ff9900;
	border-radius:5px;
	font-size:16px;
	padding:7px;
	text-align:right;
	width:30%;
}
.noline, .red {
	border:none!important;
	color:#FF0000!important;
	font-size:18px!important;
	font-weight:bold;
}
.bnr {
	background:#fff0d6;
	padding:20px 10px 0;
	margin-bottom:20px;
}
.bnr li {
	margin-bottom:20px;
}
.upbtn {
	padding:10px 0;
}
.upbtn li {
	width:50%;
	float:left;
	text-align:center;
	display:block;
}
.upbtn li a {
	background:#73de00;
	display:block;
	color:#fff;
	width:80%;
	margin:0 auto;
	padding:20px;
	font-size:18px;
	font-weight:bold;
}
.blue a {
	background:#59c2ff!important;
}
.n2-section-smartslider {
	width:95%!important;
	margin:0 auto!important;
}
.n2-section-smartslider img {
	width:100%!important;
	height:auto!important;
}
.g_bnr li {
	display:block;
	float:left;
	border:dotted 1px #75cbf3;
	width:49%;
	text-align:center;
	padding:10px 0;
}
.g_bnr li a {
	display:block;
}
/*タブ切り替え全体のスタイル*/
.tabs {
	margin-top: 50px;
	padding-bottom: 40px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	width: 100%;
	margin: 0 auto;
}/*タブのスタイル*/
.tab_item {
	width: calc(100%/2);
	height: 50px;
	border-bottom: 3px solid #5ab4bd;
	background-color: #d9d9d9;
	line-height: 50px;
	font-size: 16px;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
}
.tab_item:hover {
	opacity: 0.75;
}/*ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}
.tab_content_description table {
width::100%!important;
}/*タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 40px 40px 0;
	clear: both;
	overflow: hidden;
}
#all:checked ~ #all_content, #programming:checked ~ #programming_content, #design:checked ~ #design_content {
display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	background-color: #5ab4bd;
	color: #fff;
}






 /*タブ切り替え全体のスタイル*/
 
 .tabs01 {
margin-top: 50px;
padding-bottom: 40px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 100%;
margin: 0 auto;


}/*タブのスタイル*/
.tab_item01 {
	width: calc(100%/7);
	height: 50px;
	border-bottom: 3px solid #5ab4bd;
	background-color: #d9d9d9;
	line-height: 50px;
	font-size: 16px;
	text-align: center;
	color: #565656;
	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	transition: all 0.2s ease;
}
.tab_item01:hover {
	opacity: 0.75;
}/*ラジオボタンを全て消す*/
input[name="tab_item01"] {
	display: none;
}
.tab_content_description table {
width::100%!important;
}/*タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 40px 40px 0;
	clear: both;
	overflow: hidden;
}/*選択されているタブのコンテンツのみを表示*/
#hana:checked ~ #hana_content, #du:checked ~ #du_content, #se:checked ~ #se_content, #ne:checked ~ #ne_content, #o:checked ~ #o_content, #yuk:checked ~ #yuk_content, #chi:checked ~ #chi_content {
display: block;
}/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item01 {
	background-color: #5ab4bd;
	color: #fff;
}

.perfume{
	background:#effaff;
	margin-bottom:20px;
}

.perfume span{
	display:block;

}

.perfume ul{
	width:95%;
	margin:0 auto;
}


.perfume li{
	padding:10px 0;
	width:33%;
	float:left;
	text-align:center;
	margin-bottom:10px;
}

.perfume a{
	display:block;
	font-size:12px;
	line-height:150%;
}


.perfume li img{
	width:80%;
	height:auto;
	display:block;
	margin:0 auto;
	

	
}

h2{
	font-size:18px!important;
	display:block;
	text-align:center;
}

h2 img{
}


.infoBox{
	background:#fff4d0;
	margin-bottom:20px;
}

.infoBox div{
	padding:10px;
}

.infoBox span{
	font-weight:bold;
	font-size:18px;
	color:#FF6600;
}
.infoBox img{
	display:block;
	margin:10px auto 0;
}


.qaBox{
	background:#f3ffd4;
	margin-bottom:20px;
}

.qaBox ul{
	padding:10px;
}

.qaBox ul li{
	border-bottom:dotted 1px #dce7bf;
	padding-bottom:5px;
	margin-bottom:5px;
	font-size:14px;
}

.payBox{
	background:#ffeefe;
}
.payBox span{
	font-weight:bold;
	font-size:18px;
	color:#685b67;
}

.payBox div{
	padding:10px;
}

.Subpage,.woopage{
	border:solid 1px #95d7f6;
	font-size:14px;
}

.Subpage div{

}

.woocommerce div.product div.images{
	margin:0px!important;
}


.woocommerce div.product div.images img{
	max-width:300px!important;
	height:auto;
	margin:0 auto;

}


.woocommerce-billing-fields,.woocommerce-shipping-fields,.woocommerce-additional-fields,.woocommerce-checkout-review-order{
	padding:0 20px;
}


.woocommerce-product-gallery__image{
	margin:0 auto;
	text-align:center;
}

.Subpage .sub_tit,.woopage .sub_tit{
	background:#95d7f6;
	color:#fff;
	padding:10px 0;
}

.woocommerce table.shop_table .product-thumbnail img, .woocommerce-page table.shop_table .product-thumbnail img{
	height:auto;
}

.woocommerce table.shop_table td, .woocommerce table.shop_table th, .woocommerce-page table.shop_table td, .woocommerce-page table.shop_table th{
padding: 0.7em 0.5em!important;
}





.btns li{
	display:block;
	float:left;
	background:#0099CC;
	margin-right:10px;
}

.btns li a{
	display:block;
	color:#fff!important;
	padding:7px;
}

.yui{
	display:block;
	padding:10px 0;
	color:#FF0000;
	font-weight:bold;
}

.sahan strong{
	background:#ddd;
	display:block;
	padding:5px 0;
	font-weight:bold;
	font-size:16px;
	margin-bottom:10px;
	text-align:center;
}

.sahan{
	background:#efefef;
	margin-bottom:10px;
}


.basicInfo{

	padding:10px;
	margin:0 0 10px;
}

.basicInfo dl{
	background:#fff;
	margin-bottom:10px;
	border-radius:10px;
}

.basicInfo dl dt,.basicInfo dl dd{
	padding:10px;
}

.basicInfo dl dt{
	background:#efefef;
}

.basicInfo dl dt span{
color:#FF0000;
}

.basicInfo input,.basicInfo textarea{
	border:solid 1px #ccc;
	border-radius:5px;
	font-size:16px;
	padding:10px;
	width: 93%!important;
}

.basicInfo textarea{
	width:93%;
}


.wpcf7-submit{
	margin:0 auto;
	display:block;
	width:50%;
}

.product_meta,.woocommerce-breadcrumb,.woocommerce-product-gallery__trigger,.single-product-category,.product_title,.woocommerce-notices-wrapper{
	display:none;
}


/*　ハンバーガーメニューボタン　*/
.hamburger {
  display : block;
  position:absolute;
  z-index : 3;
  right : 20px;
  top   : 10px;
  width : 42px;
  height: 42px;
  cursor: pointer;
  text-align: center;
  background:#95d7f6;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 3px ;
  left    : 6px;
  background : #fff;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition   : 0.5s ease-in-out;
  transition        : 0.5s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* スマホメニューを開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top : 16px;
  left: 6px;
  background :#fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  background :#fff;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}

/* メニュー背景　*/
nav.globalMenuSp {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #fff;
  background: #fff;
  text-align: center;
  width: 100%;
  transform: translateX(100%);
  transition: all 0.6s;
}

nav.globalMenuSp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

nav.globalMenuSp ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .4s all;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
  background :#ddd;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #fff;
  padding: 1em 0;
  text-decoration :none;
}

/* クリックでjQueryで追加・削除 */
nav.globalMenuSp.active {
  opacity: 100;
  display: block;
   transform: translateX(0%);
}
/*プルダウンメニュー*/

/*ベース*/
.toggle {
	display: none;
}
.Label {		/*タイトル*/
	padding: 1em;
	display: block;
	color: #fff;
	background:#019ac6;
}
.Label::before{		/*タイトル横の矢印*/
	content:"";
	width: 6px;
	height: 6px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 3px );
	right: 20px;
	transform: rotate(135deg);
}
.Label,
.content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
}
.toggle:checked + .Label + .content {	/*開閉時*/
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.toggle:checked + .Label::before {
	transform: rotate(-45deg) !important;
}

/* 桜を表示するコンテナのスタイル */
.cherry-blossom-container {
  position: relative;
  width: 100%; /* コンテナの横幅 */
  overflow: hidden; /* コンテナからはみ出した要素を隠す */
}

/* 桜の花びらのスタイル */
.petal {
  position: absolute;
  background-color: #ffc0cb; /* 花びらの色 */
  border-radius: 150% 0 150% 0;
  animation: animate-petal 10s linear;
}

.petal::after {
  content: "";
  position: absolute;
  top: -14%;
  left: -10%;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #ffc0cb;
  border-radius: 150% 0 150% 0;
  transform: rotate(15deg);
}

/* 花びらが降るアニメーション */
@keyframes animate-petal {
  0% {
    top: 0;
    opacity: 0;
    transform: rotate(0deg);
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    top: 100vh;
    transform: rotate(3000deg);
  }





	
/* 以下、スマートフォン（ディスプレイ幅480px以下）より小さい画面に使われるCSS */

@media screen and (max-width: 600px) {

#wrapper {
	width:100%;
}

}