@charset "utf-8";


html{overflow-x:hidden;}
html, body{
	margin:0 !important;
	padding:0 !important;
	font-size:15px;
	line-height:1.8;
	font-family: 'Noto Sans JP';
	letter-spacing: 0.1em;
	-webkit-text-size-adjust:none;
	text-size-adjust:none;
	font-weight:normal;
}

*, *::before, *::after{box-sizing:border-box;}
li{list-style:none;}
ul, li{margin:0; padding:0;}

p{margin:0; padding:0;}


.bold{font-weight:bold;}
.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}
.uppercase{text-transform:uppercase;}
.capitalise{text-transform:lowercase;}
.hidden{display:none;}
.overlay{position:relative; z-index:1;}
.overlay::after{display:block; position:absolute; top:0; left:0; width:100%; height:100%; content:""; z-index:-1;}
.bgded{background-position:top center; background-repeat:no-repeat; background-size:cover;}
.circle{border-radius:50%; background-clip:padding-box;}

.btn01, .btn03{display:block; padding:8px 10px; font-size: 1rem; border-radius:7px; text-align:center;}
.btn02{display:inline-block; padding:6px 12px; font-size: 0.9rem; border-radius:7px; text-align:center;}
.btn04{display:block; padding:12px 10px; font-size: 1.4rem; border-radius:7px; text-align:center;}



.table{display:table; width:100%; height:100%;}
.table .table-cell{display:table-cell; height:100%;}

.clear, .group{display:block; overflow:hidden;}
.clear::before, .clear::after, .group::before, .group::after{display:table; content:"";}
.clear, .clear::after, .group, .group::after{clear:both;}

.margin_auto{margin:0 auto;}


.fl_left, .imgl{float:left;}
.fl_right, .imgr{float:right;}

.flex{display:flex;}

img{max-width:100%; height: auto; margin:0; padding:0; border:none; line-height:normal; vertical-align:middle; /*-webkit-backface-visibility: hidden;*/}


.imgl{margin:0 15px 10px 0; clear:left;}
.imgr{margin:0 0 10px 15px; clear:right;}

.img80{max-width:80%; max-height:80%; margin:0 auto;}

.width50, .width50_pc{max-width:50%;}
.width80, .width80_pc{max-width:80%;}

.pc{display:block !important;}
.sp{display:none !important;}

strong{}



/* hタグ
--------------------------------------------------------------------------------------------------------------- */
h2, h3{font-weight: normal; font-family: "Times New Roman", Times, serif !important;}

h1{font-size:0.9rem; margin:8px 0 20px 0; line-height:1.4; font-weight:normal;}
h2{font-size:2rem; display:inline-block; padding: 8px 50px; margin:0 0 0 0; line-height:1.4; color: #61A505; border-bottom: dotted #61A505 2px;}
h3{font-size:1.8rem; margin:0 0 20px 0; line-height:1.4; color: #61A505;}
h4{font-size:1.4rem; margin:0 0 10px 0; padding:6px 0; line-height:1.4; font-weight:normal; color:#61A505; border-bottom: dotted 2px #61A505;}
h5{font-size:1.2rem; margin:0 0 15px 0; line-height:1.4; padding:5px 0}
h6{font-size:1.1rem; margin:5px 0 10px 0; line-height:1.4;}

/* #pageintro h2{border-bottom: none; color:#FFF !important; margin:0; border-bottom: none;}

#pageintro h2 { display:block; text-align:center; color: #61A505; font-size:2.5rem;
  padding: 10px 0 20px 0;
  border-top: double 3px #61A505;
  border-bottom: double 3px #61A505;
} */

#pageintro h2 {position: relative; color: #fff; padding:18px 15px 18px 30px; background-color: #61A505; border-bottom: none; display:block; font-size:2.3rem;}
#pageintro h2::after {position: absolute; top: 50%; left:0; transform:translateY(-50%); content: ''; width: 18px; height:6px; background-color:#fff;}

a h3{color: #3E3E3E;}
h3.subtitle{font-size:1.6rem; line-height:1.4; padding: 10px 15px; background: #E7F4D2; border-radius:7px; color: #61A505; font-family:  'Noto Sans JP' !important;}



#right_contents h4{font-size:1.2rem; margin:0 0 10px 0; line-height:1.4; font-weight:normal; border-bottom: none;}

h5 {border-bottom: solid 3px #fff; position: relative;}
h5:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: dotted 2px #9C0;
  bottom: -3px;
  width: 10%;
}
h5 i{color:#9C0;}


#footer h3{font-size:1.3rem; margin:0 0 10px 0; line-height:1.1; padding:0; font-weight: normal;}
#footer h4{font-size:1.3rem; margin:0 0 10px 0; line-height:1.1; padding:0; font-weight: normal;}



/* Forms
--------------------------------------------------------------------------------------------------------------- */
textarea, select, input, button, label{font-size:1.1rem;}

form, fieldset, legend{margin:0; padding:0; border:none;}
legend{display:none;}
textarea, select, button{resize:none; outline:none; color:inherit; font-family:inherit; vertical-align:middle;}
:required, :invalid{outline:none; box-shadow:none;}

#newsletter input, #newsletter button, #newsletter select, #newsletter textarea{border:1px solid #9C0; margin: 0 0 10px 0; border-radius:8px; vertical-align: top;}
#newsletter input, #newsletter textarea{display:block; width:90%; padding:10px; vertical-align:top;}
#newsletter select{padding:8px; font-size:inherit;}
#newsletter button{padding:8px 50px 10px; border:none; background:#CCC; text-transform:uppercase; font-size:1.2rem; font-weight:700; cursor:pointer;}
#newsletter input[type="radio"]{display:inline-block; width:5%; outline:none; font-size:inherit; vertical-align: bottom;}
#newsletter input[type="checkbox"]{display:inline-block; width:20px; outline:none; font-size:inherit; vertical-align:bottom;}



/* frame
--------------------------------------------------------------------------------------------------------------- */
.wrapper{display:block; margin:0; padding:0; text-align:left; word-wrap:break-word;}
/*
The centred class is a generic class to simply centre the element inline with all of the other elements
It should be used in conjunction with a second class, example: .classname.centred{}
*/
#topbar, #header, .breadcrumbs, .container, .container_blog, #pageintro, #foot_banner, #footer, #copyright{display:block; margin:0 auto;}
#mainav{margin:0 auto;}


/* position
--------------------------------------------------------------------------------------------------------------- */
.bottom{position:relative; bottom:-20px; right:0;}



/* font
--------------------------------------------------------------------------------------------------------------- */
address{font-style:normal; font-weight:normal;}
hr{display:block; width:100%; height:1px; border:solid; border-width:1px 0 0 0;}

.font_size1{font-size:0.8rem !important; line-height: 1.3;}
.font_size2{font-size:0.9rem !important; line-height: 1.2;}

.font_size3{font-size:1.05rem !important; line-height:1.3;}
.font_size4{font-size:1.2rem !important; line-height:1.4;}
.font_size5{font-size:1.4rem !important; line-height:1.4;}
.font_size6{font-size:1.6rem !important; line-height:1.4;}

.underline01{background: linear-gradient(transparent 60%, #FF6 40%);}

.fontcolor_gray01{color:#999999;}
.fontcolor_red{color: #F00;}

.fontshadow{text-shadow: 1px 1px 2px #000;}



/* bgcolor
--------------------------------------------------------------------------------------------------------------- */

.bgcolor_gradation01{background: linear-gradient(180deg, #8BE2F1 0%, #E3FBF8 100%);}
.bgcolor_gradation02{background: linear-gradient(180deg, #0E5F9A 0%, #CAE3FD 100%); color:#FFF;}
.bgcolor_blue{background: #D7EDFF;}
.bgcolor_rightblue{background: #E6F3FF;}
.bgcolor_green{background:#96B724;}
.bgcolor_white{background: #fff;}
.bgcolor_yellow{background: #FFF142;}
.bgcolor_orange{background: #F90;}
.bgcolor_gray01{background: #ccc;}
.bgcolor_gray02{background: #ddd;}
.bgcolor_gray03{background: #eee;}



/* border
--------------------------------------------------------------------------------------------------------------- */
.border01{border: solid 3px #9C0;}
.border02{border: solid 1px #9C0;}
.border03{border: solid 8px #BBE8FF;}
.border04{border: solid 1px #A0A0A0;}

.border07{padding:20px 0; border-bottom: 2px dotted #CCC;}
.border08{padding:20px 0; border-bottom: 2px dotted #F4511E;}
.border09{padding:20px 0; border-bottom: 1px solid #CCC;}
.border10{padding:20px 0; border-bottom: 1px solid #F4511E;}


.border_radius01{border-radius:6px;}
.border_radius02{border-radius:8px;}


/* list
--------------------------------------------------------------------------------------------------------------- */
.main_box01 ul li{padding-left:1.2em; text-indent:-1.2em;}


ul.liststyle01, ul.liststyle02, ul.liststyle03, ul.liststyle04,  ul.liststyle05, ul.liststyle06
{ counter-reset:list; list-style-type:none; padding:0;}


ul.liststyle01 li{margin: 0 0 5px 0;}
ul.liststyle01 li:before{font-family: FontAwesome; font-size:1.3rem; padding:0 5px 0 0; content:'\f144'; color:#7FB1E0; /* アイコンのunicode */}

ul.liststyle02 li{margin: 0 0 5px 0;}
ul.liststyle02 li:before{font-family: FontAwesome; font-size:1.3rem; padding:0 5px 0 0; content:'\f144'; color:#DB0000; /* アイコンのunicode */}

ul.liststyle03 li{margin: 0 0 5px 0;}
ul.liststyle03 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f138'; color: #1972E7}

ul.liststyle04 li{margin: 0 0 5px 0;}
ul.liststyle04 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f138'; color: #7FB1E0}

ul.liststyle05 li{margin: 0 0 5px 0;}
ul.liststyle05 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f138'; color: #DB0000}

ul.liststyle06 li{margin: 0 0 5px 0;}
ul.liststyle06 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f101'; color: #DB0000}

ul.liststyle07 li{margin: 0 0 5px 0;}
ul.liststyle07 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f046'; color: #DB0000}

ul.liststyle08 li{margin: 0 0 5px 0;}
ul.liststyle08 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f058'; color: #DB0000}

ul.liststyle09 li{margin: 0 0 5px 0;}
ul.liststyle09 li:before{font-family: FontAwesome; font-size:1rem; padding:0 5px 0 0; content: '\f0da'; color: #7FB1E0}

ul.liststyle10 li{margin: 0 0 5px 0;}
ul.liststyle10 li:before{font-family: FontAwesome; font-size:1.2rem; padding:0; content: '・';}

ul.liststyle11 li{margin: 0 0 5px 0;}


/* HTML 5 Overrides
--------------------------------------------------------------------------------------------------------------- */
address, article, aside, figcaption, figure, footer, header, main, nav, section{display:block; margin:0; padding:0;}

article p{
	text-align: left;
}



/* Grid
--------------------------------------------------------------------------------------------------------------- */
.one_half, .one_third, .two_third, .one_quarter, .one_quarter03, .two_quarter, .three_quarter, .one_fifth, .two_fifth, .three_fifth, 
.main_box01, .main_box02, .main_box03, .main_box04, .one_half_sp2column, .one_quarter_sp2column
{display:inline-block; float:left; margin:0 0 0 1.6%; list-style:none;}
.main_box05{display:inline-block; float:left; margin:0 0 0 3.4%; list-style:none;}

.head_left{width:60%; display:inline-block; float:left; list-style:none;}
.head_right{width:30%; display:inline-block; float:right; list-style:none;}


.first{margin-left:0; clear:left;}

.one_quarter, .one_quarter_sp2column{width:23.8%;}
.one_third{width:32.2%;}
.one_half, .two_quarter, .one_half_sp2column{width:49.15%;}
.two_third{width:66%;}
.three_quarter{width:74.5%;}
.one_fifth{width:18%;}
.two_fifth{width:39%;}
.three_fifth{width:59%;}

#left_contents{width:72%; float:left;}
#right_contents{width:24%; float:right;}


.maxw_65{max-width:65%; margin:0 auto;}


#footer .one_quarter:first-child{width:30.8%;}
#footer .one_quarter{width:18%; margin:0 0 0 3.6%;}

.imgbox{display:inline-block; float:left; width:40%; margin: 0 2% 0 0;}
.imgbox_text{padding: 15px 0;}

.product_box{overflow:hidden;}
.product_box .one_quarter{width:28% !important;}
.product_box .three_quarter{width:69% !important; margin:0 0 0 2.8%;}



/* Spacing
--------------------------------------------------------------------------------------------------------------- */
.nospace{margin:0 !important; padding:0 !important;}

.space0{margin-top:0 !important; margin-bottom:0 !important;}

.bottomspace_6{margin-bottom:6px;}
.bottomspace_10{margin-bottom:10px;}
.bottomspace_15{margin-bottom:15px;}
.bottomspace_20{margin-bottom:20px;}
.bottomspace_25{margin-bottom:25px;}
.bottomspace_30{margin-bottom:30px;}
.bottomspace_40{margin-bottom:40px;}
.bottomspace_60{margin-bottom:60px;}
.bottomspace_80{margin-bottom:80px;}

.bottomspace10_pc{margin-bottom:10px !important;}
.bottomspace15_pc{margin-bottom:15px !important;}
.bottomspace20_pc{margin-bottom:20px !important;}
.bottomspace25_pc{margin-bottom:25px !important;}
.bottomspace30_pc{margin-bottom:30px !important;}


.inspace5{padding:5px;}
.inspace8{padding:8px;}
.inspace10{padding:10px;}
.inspace15{padding:15px;}
.inspace20{padding:20px;}
.inspace30{padding:30px;}
.inspace50{padding:50px;}
.inspace80{padding:80px;}



@media screen and (max-width:750px){
	
html, body{
	margin:0 !important;
	padding:0 !important;
	font-size:14px;
	line-height:1.7;
	letter-spacing: -0.02em;
	-webkit-text-size-adjust:none;
	text-size-adjust:none;
}
	
	h1{text-align:left !important; margin:8px 50px 20px 0; line-height:1.4; font-weight:normal;}
	
	.flex{display:block;}


	#pageintro h3{font-size:1.5rem;}

	.pc{display:none !important;}
	.sp{display:block !important;}
	
	.one_half, .one_third, .two_third, .one_quarter, .one_quarter02, .one_quarter03, .two_quarter, .three_quarter, .two_fifth, .three_fifth, .one_fifth{display:block; float:none; width:auto; margin:0 0 20px 0; padding:0;}
	
	#left_contents{display:block; float:none; width:auto; margin:0 0 50px 0;}
	#right_contents{display:block; float:none; width:auto; }

	
	.one_quarter_sp2column{width:49.15%;}
	.one_quarter_sp2column:nth-child(2n+1) {margin:0 0 1% 0; }
	.one_quarter_sp2column:nth-child(2n) {margin:0 0 1% 1.6%; }

	.one_half:last-child, .one_third:last-child, .two_third:last-child, .one_quarter:last-child, .two_quarter:last-child, .three_quarter:last-child{margin:0 0 0 0;}



	#pageintro h2{margin:10px 0 20px;}
	#pageintro .one_half{margin:0;}


	#logo .width55{max-width:95%;}
    .head_left{width:65%; display:inline-block; float:left; list-style:none;}
    .head_right{width:32%; display:inline-block; float:right; list-style:none;}
	
	#topimg02.main_box01, #topimg02.main_box02{margin:0; padding:0;}

	.main_box01, .main_box02, .main_box03, .main_box04, .main_box05{display:block; float:none; width:auto; margin:0; padding:0;}
	
	.width40, .width50_pc, .width85_pc{max-width:100%; margin: 0 auto;}
	.maxw_65{max-width:100%;}
	.maxw_65 .one_half{width:48.5%; float:left; margin: 0 0 0 1%;}
	
	#list .one_third, #link .one_third{width:48.5%; float:left; margin: 0 0 0 1%;}
	#list .one_third:nth-child(2n+1) {margin:0 0 1% 0; }
	#list .one_third:nth-child(2n) {margin:0 0 1% 1.6%; }
	#list .first{margin-left:0; clear: none;}
	
	#list02 .one_third, #link .one_third{width:48.5%; float:left; margin: 0 0 0 1%;}
	#list02 .one_third:nth-child(2n+1) {margin:0 0 1% 0; }
	#list02 .one_third:nth-child(2n) {margin:0 0 1% 1.6%; }
	#list02 .first{margin-left:0; clear: none;}
	
	#list02 .one_quarter, #link .one_quarter{width:48.5%; float:left; margin: 0 0 0 1%;}
	#list02 .one_quarter:nth-child(2n+1) {margin:0 0 1% 0; }
	#list02 .one_quarter:nth-child(2n) {margin:0 0 1% 1.6%; }
	
	
	#link .one_third:nth-child(2n+1) {margin:0 0 1% 0; }
	#link .one_third:nth-child(2n) {margin:0 0 1% 1.6%; }
	#link .first{margin-left:0; clear: none;}

	#footer .one_quarter:first-child{width:100%; border-bottom:solid 1px #FFF; padding: 0 0 20px 0;}
	#footer .one_quarter{width:47%; float:left; margin:0 0 0 1%; padding:20px 0 0 0;}

.boxtype08 .box-title {font-size: 16px;}
	
	
.bottomspace10_pc{margin-bottom:0px !important;}
.bottomspace15_pc{margin-bottom:0px !important;}
.bottomspace20_pc{margin-bottom:0px !important;}
.bottomspace25_pc{margin-bottom:0px !important;}
.bottomspace30_pc{margin-bottom:0px !important;}

.nospacesp{margin:0 !important; padding:0 !important;}

}