/*
	Theme Name: HTML5 Blank
	Theme URI: http://html5blank.com
	Description: HTML5 Blank WordPress Theme
	Version: 1.4.3
	Author: Todd Motto (@toddmotto)
	Author URI: http://toddmotto.com
	Tags: Blank, HTML5, CSS3

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/********** トップページcss 2020/08/25 **********/

.header-inner{
	width: 70%;
	margin: auto;
}
.header-top{
	list-style: none;
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
	display: flex;
	padding-left: 0;
}
/* li.header-top-item{
	margin: 1%;
} */
li.header-top-item:first-child{
	width: 24.5%;
}
li.header-top-item:nth-child(2){
	width: 17.5%;
  margin: 1%;
  text-align: center;
}
li.header-top-item:nth-child(3){
	width: 13.5%;
}
li.header-top-item:nth-child(4){
	width: 19.5%;
	margin-top: 12px;
}
li.header-top-item:nth-child(5){
	width: 19.5%;
}

li.header-top-item.add{
	margin-top:26px;
}
li.header-top-item.add a{
	background-color: #2B296F;
  font-weight: 500;
  color: #fff;
  padding: 15px 8px;
}
li.header-top-item.add_{
	text-align: center;
}
li.header-top-item.add_ a{
	background-color: #A4915E;
  padding: 2px;
  display: block;
  padding: 6px 6px;
  color: #fff;
}
.sns-icons{
	list-style: none;
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
	display: flex;
	padding-left: 0;
	flex-wrap: wrap;
	margin-left: 4%;
  margin-top: 5%;
}
li.icon-item{
	width: 15%;
	text-align: center;
	margin-bottom: 1%;
}
li.icon-item.add{
	width: 100%;
	text-align: left;
}
li.icon-item.add_{
	margin-left: 7%;
}
.nav-list{
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
	display: flex;
}
.nav-list li{
	width: 10%;
	-webkit-transform: skewX(150deg);
-moz-transform: skewX(150deg);
transform: skewX(150deg);
border-right: 1px solid #000;
text-align:center;
}
.nav-list li:first-child{
	width: 6%;
}
.nav-list li:nth-child(6){
	width: 15%;
}
.nav-list li:nth-child(9){
	width: 6%;
}
.nav-list li:last-child{
	width: 6%;
	border-right: none;
}

.nav-list li a{
	display:block;
transform: skewX(-150deg);
}

.slick-prev,
.slick-next{z-index: 99;}
.slick-prev{left: 50px;}
.slick-next{right: 50px;}


/********** SP **********/
@media screen and (max-width:480px) {
	.header.sp.bg-white{
		position: fixed!important;
    width: 100%;
    z-index: 1;
	}

	.wrapper {
    padding-top: 75px;
	}
	header {
  padding:10px;
  background: #ccc;
}

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 40px;
  height: 36px;
  vertical-align: middle;
}

/*ハンバーガーの形をCSSで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
    height: 3px;
    width: 40px;
    /* border-radius: 3px; */
    background: #555;
    display: block;
    content: '';
    cursor: pointer;
    bottom: 50px;
}
#nav-open span:before {
  bottom: -12px;
}
#nav-open span:after {
  bottom: -25px;height: 3.5px;
}

/*閉じる用の薄黒箇所*/
#nav-close {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*メニューの中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  width: 90%;
  max-width: 330px;/*最大幅（お好みで調整を）*/
  height: 100%;
  background: #fff;
  transition: .3s ease-in-out;
  -webkit-transform: translateX(105%);
  transform: translateX(105%);
}

/*チェックがついたら表示させる*/
#nav-input:checked ~ #nav-close {
  display: block;
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

.header-logo-menu{
 display: flex;
 display: -moz-flex;
 display: -o-flex;
 display: -webkit-flex;
 display: -ms-flex;
 flex-direction: row;
 -moz-flex-direction: row;
 -o-flex-direction: row;
 -webkit-flex-direction: row;
 -ms-flex-direction: row;
}

/*ロゴやサイトタイトルをセンタリング*/
.logo-area{text-align:center;margin:auto;}

.slick-prev,.slick-next {display: none!important;}
#nav-input:checked ~ #nav-content {
    background-color: rgba(3,0,76,0.8);
}
	ul.hamberger-menu li{
		background-image: url('https://body-improve.onion.jp.net/wp-content/themes/html5blank-stable/img/top/header/arrow-white.svg');
    background-repeat: no-repeat;
    background-position: 95%;
		border-bottom: 1px solid #fff;
    padding: 5px 0;
    padding-left: 10px;
		background-size: 6%;
		font-size: 16px;
    color: #fff;
	}
	ul.hamberger-menu li:first-child{
		border-top:2px solid #fff;
	}
	ul.hamberger-menu li:last-child{
		border-bottom:0px solid #fff;
	}
	ul.hamberger-menu li a{
		font-size: 16px;
    color: #fff;
	}
	.width-45{width: 45%;}

	ul.hamberger-menu li.add{
		border-bottom: 1px solid #fff;
	}




















}
