@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 4.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*


/*ヘッダー*/
body.custom-background{
	background-color: #F7F7F7 !important;
}
.header {
    box-shadow: 0 3px 6px rgb(0 0 0 / 8%);
}
/*ロゴ*/
#logo, #logo img, .desktop-nav li a, #drawer__open {
    height: 50px;/*スマホ用サイズ*/
    line-height: 50px;/*スマホ用サイズ*/
    object-fit: contain;
}
#logo:before{
	height: 50px;
}

/*ウィジェット*/
.insidesp .widgettitle{
	font-size: 1.2em;
    color: #1faced !important;
    background-color: #F7F7F7 !important;
}
.widget{
	font-size: 0.85em;
	background-color: #F7F7F7 !important;
}
.insidesp ul{
	padding: 6px 10px 14px 15px;
}
.widget ul li a{
	color: #444;
	display:initial;
}
#sidebar1 h4:first-child{
	padding-top: 0;
}
.widget ul li a:hover {
	background: #F7F7F7;
	color: #e35360;
}
.widget ul.brandList li a{
	padding: 3px;
}
ul.sideCategory{
	padding: 0 !important;
}
ul.sideCategory li{
	padding-top: 15px;
}
.widget-menu li{
	background-color: #F7F7F7 !important;	
}
.widget-menu li,.widget-menu li:nth-child(even){
	border: none !important;
}

/*色*/
.red{
	color: #e35360;
}
.memo.alert .memo_ttl{
	color: #e35360;	
}
.memo.alert .memo_ttl:before{
	background: #e35360;
}
.memo.alert {
    background: #fff2f3;
}
.memo{
	background: #fffae7;
	color: #252525 !important;
}
.memo_ttl{
	color: #ffcc00;
	
}
.memo_ttl:before{
	background: #ffcc00;
}

/*ボタン*/
.afi-b,.afi-o{
	display: block;
	width: 100%;
	margin: 0 auto;
}

.afi-b a,.afi-o a{
	display: block;
	position: relative;
	z-index: 2;
	overflow: hidden;
	width: 100%;
	background-color: #ffc71d;
	border-bottom:7px solid #f2b600;
	border-radius: 50px;
	color: #ffffff;
	padding: 12px;
	text-align: center;
	text-decoration: none;
	transition: .25s linear;
	-webkit-transition: .25s linear;
	-moz-transition: .25s linear;
	font-weight: bold;
	font-size: 16px;

}
.afi-o a{
	margin-bottom: 12px;
	background-color: #ea6470;
	border-bottom:7px solid #e35360;
}

.afi-b a:hover, .afi-o a:hover{
	opacity: 0.6;
	color: #fff !important;
	text-decoration: none;
}
.afi-b a:before, #f-btn a:before, .afi-o a:before{
	display: block;
	position: absolute;
	z-index: -1;
	left: -30%;
	top: -50%;
	content: "";
	width: 30px;
	height: 100px;
	transform: rotate(30deg);
	-webkit-transform: rotate(30deg);
	-moz-transform: rotate(30deg);
	background-image: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);
 	background-image: -webkit-gradient(linear, left bottom, right bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,1)),color-stop(100%,rgba(255,255,255,0)));
	background-image: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff rgba(255,255,255,1),rgba(255,255,255,0) 100%);
	animation: shiny 3s infinite linear;
	-webkit-animation: shiny 3s infinite linear;
	-moz-animation: shiny 3s infinite linear;
}

.scroll-table {
    overflow: auto;
    white-space: nowrap;
    border: solid 1px #ddd;
    margin-bottom: 20px;
    table {: ;
    margin: 0;
    border: none;
    }: ;
}

@keyframes shiny {
	0% {
		left: -30%;
	}
	20% {
		left: 120%;
	}
	100% {
		left: 120%;
	}
}
@-webkit-keyframes shiny {
	0% {
		left: -30%;
	}
	20% {
		left: 120%;
	}
	100% {
		left: 120%;
	}
}
@-moz-keyframes shiny {
	0% {
		left: -30%;
	}
	20% {
		left: 120%;
	}
	100% {
		left: 120%;
	}
}


@media only screen and (min-width: 768px) {
    #logo, #logo img, .desktop-nav li a {
       height: 45px;/*768px〜で見たとき用サイズ*/
       line-height: 70px;/*768px〜で見たとき用サイズ*/
    }
    .afi-b,.afi-o{
		width: 85%;
	}
	.afi-b a,.afi-o a{
		font-size: 1.0rem;
	}	
    
}

/*フッター*/
#footer-menu, .drawer__title{
	background-color: #1faced !important;
}


.center{
	text-align: center;
}


/*hタグ*/
.entry-content h2{
	margin-right: 5px;
	margin-left: 5px;
	padding: 0.3em 0.5em;
	border: dashed 1px #fff;
	background: #c8e4ff;
	box-shadow: 0 0 0 5px #c8e4ff;
	color: #454545;
}
.entry-content h3{
    padding: 0.6em 0;
    border-width: 3px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-color: #1faced;
    color: #1faced;
    border-left: none;
}
.entry-content h4{
	margin: 2.6em 0 0.7em;
	padding: 10px 0 10px 10px;
	border-left-width: 4px;
	border-left-style: solid;
	font-size: 1.2em;
	line-height: 1.5;
	border-color: #1faced;
}