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

* { 
    margin: 0px; 
    padding: 0px; 
}
.ham {
	position: absolute;
	top:20px;
	left:30px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	background-color:#F9F8F7;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-radius: 3px;
	z-index:1050
}
.ham_line {
	position: absolute;
	left: 5px;
	width: 20px;
	height: 1px;
	background-color: #333333;
}
.ham_line1 {
	top: 6px;
}
.ham_line2 {
	top: 14px;
}
.ham_line3 {
	top: 22px;
}
.ham_line {
	transition: all 0.3s;
}

/* 以下はすべて新規行で追加 */

.clicked .ham {
	border: 1px solid #666;
}
.clicked .ham_line1 {
	transform: rotate(45deg);
	top: 14px;
}
.clicked .ham_line2 {
	width: 0px;
}
.clicked .ham_line3 {
	transform: rotate(-45deg);
	top: 14px;
}





.menu {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	left: -100%;
	background-color: #FFF;
	transition: all 0.3s;
	overflow: scroll;
	z-index:1000;
}
.clicked .menu {
	left: 0px;
}
.menu_in {
	padding-top: 80px;
	padding-left: 50px;
}

.collection {
	font-size: xx-small;
	color: #666;
	margin-bottom: 15px;
}

.menu_ham_l ul {
	list-style-type: none;
}
.menu_ham_l li {
	font-size: x-large;
	margin-bottom: 3px;
	list-style-type: none;
	line-height: 1.5em;
	text-align: left;
}
.menu_ham_l li a {
	text-decoration: none;
}
.menu_ham_l li a:hover {
	opacity: 0.5;
  -ms-filter: "alpha(opacity=50)"
}

.menu_ham_l_02 ul {
	list-style-type: none;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #999;
}

.menu_ham_l_02 li {
	font-size: large;
	margin-bottom: 3px;
	list-style-type: none;
	line-height: 1.5em;
	text-align: left;
}

.menu_ham_l_02 li a {
	text-decoration: none;
}
.menu_ham_l_02 li a:hover {
	opacity: 0.5;
  -ms-filter: "alpha(opacity=50)"
}
.line_box {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #E4E4E4;
	margin-right: 50px;
	margin-top: 20px;
	margin-bottom: 20px;
}

/*ヘッダー部分*/
.header_all {
	position:fixed;
	top:0;
	right:0;
	left:0;
	z-index:1030;
	width: 100%;
	height: 70px;	/*display:flex;*/
}
.header_all {
	background-color:#F9F8F7;
	transition:.2s
}

.header_menu01 {
	position:fixed;
	top:0;
	width: 40%;
}
/*.header_title {
	height: 50px;
	width: 300px;
	margin-right: auto;
	margin-left: auto;
	display:block;
	z-index:2060;
	margin-top: 0px;
	background-color: #069;
}*/
.header_title {
	/*display:flex;
	align-items:center;*/
	position:absolute;
	left:50%;
	transform:translateX(-50%);
}
.title_img {
	height: 30px;
	transition: .3s;
}


.link_ho a:hover img {
  opacity: 0.5;
  -ms-filter: "alpha(opacity=50)"
}


.header_title_in{

}

.header_title img{
	padding-top: 10px;
		/*width: 80%;
	padding-left: 20%;	*/
}

.header_menu01_lis{
	display:none;
	}
	
.header_utility{
	float: right;
	width: 40%;
	display:block;
	/*background-color: #963;*/
	}
.header_utility span{
	display:none;
	}



.nav01 {
	display:flex;
	list-style-type: none;
	margin-top: 20px;
	margin-left: 80px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align: left;
}
.nav01 li {
	padding-right: 20px;
	
}

.nav-link01 {
	text-decoration: none;
}
a.nav-link01 {
	color: #666;
}
a:hover.nav-link01 {
	color: #999;
}

.nav_utility {
	display:flex;
	justify-content: flex-end;
	list-style-type: none;
	margin-top: 20px;
	margin-right: 15px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.nav_utility li {
	padding-right: 20px;
}

.nav_utility {
	text-decoration: none;
}



.font_col {
	color: #333;
}



/* タブレットレイアウト : 481 px ～ 768 px。モバイルレイアウトからスタイルを継承。 */

@media print, screen and (min-width: 481px) {
	
.title_img {
	height: 37px;
	transition: .3s;
}
.menu {
	width: 500px;
	height: 100%;
	left: -500px;
}

}

/* デスクトップレイアウト : 769 px ～最大 870 px。モバイルレイアウトとタブレットレイアウトからスタイルを継承。 */

@media print, screen and (min-width: 769px) {
	
.header_menu01_lis{
	float: left;
	/*background-color: #FF0;
	display:block;*/
	width: 100%;
	display:flex;
	}
.nav_utility {
	margin-right: 40px;
}
.title_img {
	height: 36px;
}
	
	}

/* デスクトップレイアウト : 769 px ～最大 1000 px。モバイルレイアウトとタブレットレイアウトからスタイルを継承。 */

@media print, screen and (min-width: 869px) {
	.title_img {
	height: 40px;
}
	
	.header_utility span{
		display:inline;
	}

	
	}
	

/*
.u-white .l-header{
	background-color:#fff
	}
.page-invert .l-header{
	background-color:transparent
	}
.page-invert .l-header a{
	color:#fff
	}
.page-invert .l-header .l-menu a{
	color:#000
	}
.page-invert.-scroll .l-header{
	background-color:#F9F8F7
	}
.page-invert.-scroll .l-header a{
	color:#000}
.l-header a{color:#000;text-decoration:none;transition:.2s}
.l-header a:hover,.l-header a:focus{opacity:.6}
.l-header .nav-link{display:flex;align-items:center;position:relative}]
.l-header .icon-font{display:inline-block;line-height:1}
.l-header__si{display:flex;align-items:center;position:absolute;left:50%;transform:translateX(-50%)}*/