/*
Theme Name: MI-LAB default
Text Domain: MI-LAB
Version: 1.0
Author: Masaru Ide
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

	0. 	CSS Reset
	1. 	Document Setup
	2. 	Element Base
	3. 	Helper Classes
	4. 	Site Header
	5. 	Menu Modal
	6. 	Search Modal
	7. 	Page Templates
		a. 	Template: Cover Template
		c. 	Template: Full Width
	8.  Post: Archive
	9.  Post: Single
	10. Blocks
	11. Entry Content
	12. Comments
	13. Site Pagination
	14. Error 404
	15. Widgets
	16. Site Footer
	17. Media Queries

----------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */

/*	2. Element Base
/* ---------------------------------------------*---------------------------- */



h1,
h2,
h3,
h4,
h5,
h6,
.faux-heading {
	font-feature-settings: "lnum";
	font-variant-numeric: lining-nums;
	font-weight: 700;
	letter-spacing: -0.0415625em;
	line-height: 1.25;
	margin: 3.5rem 0 2rem;
}

h1,
.heading-size-1 {
	font-size: 2.8rem;
	font-weight: 800;
	line-height: 1.138888889;
}

h2,
.heading-size-2 {
	font-size: 2.8rem;
}

h3,
.heading-size-3 {
	font-size: 2.6rem;
}

h4,
.heading-size-4 {
	font-size: 2.4rem;
}

h5,
.heading-size-5 {
	font-size: 2.1rem;
}

h6,
.heading-size-6 {
	font-size: 1.6rem;
	letter-spacing: 0.03125em;
	text-transform: uppercase;
}

p {
	line-height: 1.8;
	margin: 0 0 1em 0;
}

em,
i,
q,
dfn {
	font-style: italic;
}

em em,
em i,
i em,
i i,
cite em,
cite i {
	font-weight: bolder;
}

big {
	font-size: 1.2em;
}

small {
	font-size: 0.75em;
}

b,
strong {
	font-weight: 700;
}

ins {
	text-decoration: underline;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

abbr,
acronym {
	cursor: help;
}

address {
	line-height: 1.5;
	margin: 0 0 2rem 0;
}

hr {
	border-style: solid;
	border-width: 0.1rem 0 0 0;
	border-color: #dcd7ca;
	margin: 4rem 0;
}




/* Lists ------------------------------------- */

ul,
ol {
	margin: 0;
}

ul ul {
	list-style: circle;
}

ul ul ul {
	list-style: square;
}

ol {
	list-style: decimal;
}

ol ol {
	list-style: lower-alpha;
}

ol ol ol {
	list-style: lower-roman;
}

li {
	line-height: 1.5;
	margin: 0.5rem 0 0 0;
}

li > ul,
li > ol {
	margin: 1rem 0 0 2rem;
}

.reset-list-style,
.reset-list-style ul,
.reset-list-style ol {
	list-style: none;
	margin: 0;
}

.reset-list-style li {
	margin: 0;
}

dt,
dd {
	line-height: 1.5;
}

dt {
	font-weight: 700;
}

dt + dd {
	margin-top: 0.5rem;
}

dd + dt {
	margin-top: 1.5rem;
}

/* -------------------------------------------------------------------------- */

/*	4. Site Header
/* ---------------------------------------------*---------------------------- */
header#site-header { top:0;}

header#site-header div.header-titles h1.site-title { margin: 2rem 0 0 2rem; background-size:43px auto; background-position: 0 2px; padding-left: 50px; }


header#site-header div#nav-content {
	position:relative;
	top: 2.6rem;
	right: 0;
	width:100%;
}

header#site-header div#nav-content nav {
}

header#site-header div#nav-content nav ul#main-nav {
	display:block;
	width:100%;
	margin: 0 0　0　0!important;
	border-bottom: 1px solid  #5b9b39;
}

header#site-header div#nav-content nav ul#main-nav li {
	margin: 0 0 0 0;
	line-height:8rem;
	width:100%;
}
header#site-header div#nav-content nav ul#main-nav li a,header#site-header div#nav-content nav ul#main-nav li.menu-item-79 a { 
	display:block;
	position:relative;
	cursor:pointer;
	color: #5b9b39;
	font-weight: 600;
	text-decoration:none;
	padding: 0.8rem 0;
}
header#site-header div#nav-content nav ul#main-nav li a:hover,header#site-header div#nav-content nav ul#main-nav li.menu-item-79:hover {background-color:#5b9b39; color:#fff!important;}
header#site-header div#nav-content nav ul#main-nav li a::after {transform:none; height:auto;}

	header#site-header div#nav-content nav ul#main-nav li.menu-item-79 { display:block; background: #fff;padding: 0; border-bottom:1px solid #5b9b39; line-height:8rem}
	header#site-header div#nav-content nav ul#main-nav li.menu-item-79 a { display:block; color:#5b9b39; height:auto; }
	header#site-header div#nav-content nav ul#main-nav li.menu-item-79 a:hover{ color:#fff; height:auto;}

	#nav_toggle{ top:4rem; }


header#site-header div#nav-content ul#menu li#menu-item-32 {
	position:relative;
	top:auto;
	right:auto;
	margin:0;
	background: none;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	line-height: auto;
	font-size: 1.6rem;
	line-height: 60px;
}

header#site-header div#nav-content ul#menu li#menu-item-32 a { color: #5b9b39;}

header#site-header div#nav-content ul#menu li#menu-item-32 a:hover {
	border-top-left-radius: 0;
	border-bottom-left-radius:0;
	color:#fff;
}



/* SNS ------------------------------------- */
div.sns { margin: 1rem 0 0;}

/* ボタン全体 */
.flowbtn6{
border-radius:12px;		
position:relative;
display:inline-block;
width:25px;
height:25px;
font-size:18px;
color:#fff!important;
transition:.5s;
text-decoration:none;
}	
/* ulタグの内側余白を０にする */
ul.snsbtniti{
padding:0!important;
	width:fit-content;
}
/* アイコンボタン全体の位置 */
.snsbtniti{
display:flex;
flex-flow:row wrap;
justify-content:space-around;
}
/* アイコンボタン同士の余白 */
.snsbtniti li{
flex:0 0 33%;
text-align:center!important;
}

/* Twitter */
.fl_tw1{
background:#55acee;
}
/* Instagramアイコン位置 */
.insta_btn6 .fa-instagram{
font-size:40px;
}
/* Instagram紫グラデ背景 */
.insta_btn6 {
background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
overflow:hidden;	
}
/* Instagramオレンジグラデ背景 */
.insta_btn6:before{
content: '';
position: absolute;
top:27px;
left:-12px;
width:59px;
height:40px;
background:-webkit-radial-gradient(#ffdb2c 7%, rgba(255, 105, 34, 0.3) 60%, rgba(255, 88, 96, 0) 70%);
background:radial-gradient(#ffdb2c 7%, rgba(255, 105, 34, 0.3) 60%, rgba(255, 88, 96, 0) 70%);
}
/* Facebookアイコン位置 */
.fl_fb6 .fa-facebook-f{
position:relative;
top:3px;
left:2px;
font-size:20px;
}
/* Facebookアイコン背景*/
.fl_fb6{
background:-webkit-linear-gradient(top, #5c80c6 0%, #34528c 74%);	
background:linear-gradient(to bottom, #5c80c6 0%, #34528c 74%);	
}

/* YouTube */
.fl_yu6 {
color:#fc0d1c!important;
box-shadow:0 0 2px #888;	
}

div#site-container { margin:0;}

article div.page { padding: 0;}
article div.page h2 { display: inline; text-align:center; color:#5b9b39; margin: 0 auto; padding: 1rem 2rem ;line-height: 4rem; border: 0.5rem solid #5b9b39; border-radius: 3rem;}
article div.page h3 { font-size: 2.5rem; line-height: 5rem;}

article div.post { padding: 0;}

article div.post div.entry {
	margin: 5rem 0;
}

/* Categories Archives*/
div#List {
	display: flex;
	flex-wrap:wrap;
	width:100%;
	margin: 5rem auto;
}

div.List_box {
	display:block;
	width:48%;
	margin: 2rem 1%;
}



article div.page table {
	width: 100%;
	margin: 3rem 0;
}

article div.page table thead th {
	padding: 2rem 0;
	text-align:center;
	border-bottom: 2px solid #333!important;
}

article div.page table td {
	padding: 3rem;
}

article div.post div.entry img {
	margin: 3rem 0;
	width: 100%;
	height: auto;
}

section#blog { 
	width:100%;
	position:relative;
}

section#blog h2 {
	font-size: 2.5rem;
	margin: 0 0 0 1.65%;
}



div.category-description {
	position:absolute;
	top: 0; 
	right: 17rem;
}
div.List {
	float:left;
}
div.article_box {
	position:relative;
	float: left;
	width:30%;
	margin: 0 1.65% 3em;
	text-align:justify;
}
div.article_box h3 {	font-size: 1.8rem;}
div.Link_more { position: absolute; top :0rem; right: 2rem;}
div.Link_more p {  background: #eee; padding:0 1.5rem; line-height:2.5; border-radius:10px;}
div.Link_more a { color: #333;}

section#newentry div.tab_container { width:97%; margin: 0 1.5% 0; }
ul.tab {left: auto; right: 2rem; }

.tab_content ul li{ 
	margin-left: 4.4em;
	text-indent:-4.8em;
	}


/* -------------------------------------------------------------------------- */

/*	16. Site Footer
/* -------------------------------------------------------------------------- */

footer {
	width:100%;
}

div#footer_container {
  display: block;
	width: 90%;
	padding: 5rem 3rem 6rem;
}

footer div.map iframe {  width: 100%!important;  min-width:63rem;  margin: 0 0 0 0; }
footer div#footer_text h2 { margin:0!important; }
footer div#footer_text ul li { width: 25%;}
footer div#footer_text h2 img { width:380px; height:auto; }
footer div#footer_text figure.wp-block-table table  { width:auto!important; margin: 1rem 0 0 ;}
footer div#footer_text figure.wp-block-table table td { padding: 0 2rem 0 0; }



/* -------------------------------------------------------------------------- */

/*	17. Contact form
/* -------------------------------------------------------------------------- */
article div.page div.wp-block-contact-form-7-contact-form-selector {
	width: 80%;
	margin: 3rem auto;
}
article div.page div.wp-block-contact-form-7-contact-form-selector label {
	font-weight:600;
}
article div.page div.wp-block-contact-form-7-contact-form-selector input,article div.page div.wp-block-contact-form-7-contact-form-selector select,article div.page div.wp-block-contact-form-7-contact-form-selector textarea {
	width: 100%;
	margin: 0 0rem 3rem;
	font-size:1.8rem;
	padding: 1.5rem;
}
article div.page div.wp-block-contact-form-7-contact-form-selector textarea {
	line-height:2rem;
}



#form{
 position:relative;
}
#s-box{
 height: 40px;
 padding: 0 10px;
 position: absolute;
 left: 0;
 top: 0;
 border-radius:2px;
 border:solid 3px #eaeaea;
 outline: 0;
}
#s-btn-area{
 height: 50px;
 position: absolute;
 left:250px;
 top: 0;
 background:none;
 color:#666;
 border:none;
 font-size:20px;
 outline: 0;
}
#s-btn{
 background-color: black;
 width: 50px;
 height: 30px;
 position: relative;
 right: 20px;
 bottom: 10px;
 border-radius: 3px;
 font-size: 16px;
 color: #fff;
 line-height: 31px;
}