@charset "utf-8";

/*
	基礎となるstyle

*/

/* -----------------------------------------------
font-size
-------------------------------------------------- */
/*for SP*/
@media screen and (max-width:768px) {
	body,html{
		font-size: 14px;
	}
	}
	
	/*for tablet*/
	@media screen and (max-width:1200px) {
		body,html{
		font-size: 16px;
	}
	}
	
	/*for PC*/
	@media screen and (min-width:1201px) {
		body,html{
		font-size: 18px;
	}
	}

/* -----------------------------------------------
color
-------------------------------------------------- */
:root{
	--baseBlack: #231816;
	--baseColor:#fffef7;
	--mainColor: #0b7240;
	--accentColor:#f8daac;
	--brownColor:#504236;
	--btn-shadow:3px 3px 7px rgba(0, 0, 0, 0.15);
	--accentGreen:#bae3d3;
	--accentOrange:#f5bb63;
}

a{
	color: var(--baseBlack);
}

/* -----------------------------------------------
 html, body
-------------------------------------------------- */
html {
	-webkit-overflow-scrolling: touch;
	/* font-size: 18px; */
}
body {
	margin: 0;
	font-size: 1rem;
	font-family: "BIZ UDPGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-weight: normal;
	line-height: 1.6;
	text-align: left;
	background-color: var(--baseColor);
	box-sizing: border-box;
	color: var(--baseBlack);
}
* html,body {
	height:100%;
	box-sizing: border-box;
}
*:hover {
	transition: all 0.3s;
}
*, *:before, *:after {
	box-sizing: border-box;
	}
/* -----------------------------------------------
 html, body > 768px以下（tablet）
-------------------------------------------------- */
	 @media screen and (max-width: 768px) {
		 body { padding-bottom: 0px; }
	}

/* -----------------------------------------------
 html, body > 576px以下（smartPhone）
-------------------------------------------------- */
	@media (max-width: 576px) {
		html {font-size: 14px;}
		body { line-height: 1.5;}
		p,li,dl,dt{ font-size:14px; font-size:1em;}
	}

/* -----------------------------------------------
  Layout
-------------------------------------------------- */
.wrapper {
	width: 100%;
	position: relative;
	overflow: none;
	margin: 0 auto;
	padding-top: 6rem;
}
.wrapper:after {
	content: "";
	display: table;
	height: 0;
	visibility: hidden;
	clear: both;
}
.inner {
	width: 1200px;
	margin: 0 auto;
}
.container{
	padding-top: 3.75rem;
	padding-bottom: 3.75rem;
}
.container p{
	line-height: 2;
	text-align: left;
}
.row p {
	line-height: 1.75em;
	text-align: left;
}
.w800{
	max-width: 800px;
	margin: 0 auto
}
img {
	max-width: 100%;
	height: auto;
}
[class*="col-"] img {
	max-width: 100%;
	height: auto;
}
/* -----------------------------------------------
  Layout > 1200px以下
-------------------------------------------------- */
@media screen and (max-width: 1200px) {
	.inner {
		width: calc(100% - 4rem);
	}
}
/* -----------------------------------------------
 Layout > 992px以下
-------------------------------------------------- */
@media screen and (max-width: 992px) {

	.inner {
		width: calc(100% - 2rem);
	}
}
/* -----------------------------------------------
  Layout > 768px以下（tablet）
-------------------------------------------------- */
	 @media screen and (max-width: 768px) {
		 
		 .container{
			 padding-top: 30px;
			 padding-bottom: 30px;
		 }
	}
/* -----------------------------------------------
  Layout > 576px以下（smartPhone）
-------------------------------------------------- */
	@media (max-width: 576px) {
		.inner {
			
		}
		.no_br br{ display: none; }
		br.no_br{ display: none; }
	}


/* -----------------------------------------------
 Aligns & Formats
-------------------------------------------------- */
.fl {
	float: left;
}
.fr {
	float: right;
}
.center {
	float: none;
	margin: 0 auto;
	display: block;
	text-align: center;
}
.imgleft {
  float: left;
  margin: 5px 20px 20px 0;
}
.imgright {
  float: right;
  margin: 5px 0 20px 20px;
}
.imgcenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	margin-bottom: 20px;
}
.oh {overflow: hidden;}
.hidden {display: none !important;}
.hidden-text {font: 0/0 a !important;}
.clear {clear: both; display: block;}

/* -----------------------------------------------
checkbox
-------------------------------------------------- */

label, input[type='checkbox'] {
    cursor: pointer;
}

/* -----------------------------------------------
 dl list
-------------------------------------------------- */
dl.list {
	line-height: 1.6;
	width: 90%;
	margin: 0 auto 2em auto;
}
dl.list dt {
	float:left;
	width:15%;
	padding:1em;
	text-align: left;
}
dl.list dd {
	margin-left:15%;
	padding:1em;
	text-align: left;
}
dl.list dd li{
	line-height: 1
}

/* -----------------------------------------------
 structure module
-------------------------------------------------- */
/*link*/
a {/*bg_color-white.css*/}
a:hover, a:focus {/*bg_color-white.css*/}
a:hover { text-decoration: none;}
.blank{}

/*border box*/
.border_box{ padding: 2em; }

/*box style*/
.radius{ border-radius: 5px; }
.circle { border-radius: 50%; }


/*ロールオーバー透過画像*/
a :hover.lo {
    filter: alpha(opacity=60); 
    opacity:0.6; 
    -moz-opacity:0.6;
}

/* -----------------------------------------------
list module
-------------------------------------------------- */
ul#inline li{
	padding: 5px;
	float:left;
	display: inline-block;
	width: 25%;
}
/* ul disc */
ul.listDisc {
	margin-bottom: 1em;
}
ul.listDisc li {
	padding-left: 1em; /*1em（1文字）分、右に動かす*/
	text-indent: -1em; /*最初の行だけ1em（1文字）分、左に動かす*/
	list-style-type: disc;
	padding-bottom:0.5em;
}
 .listDisc li .listDecimal li{
	 line-height:1.4;
	 margin-bottom:0
 }
/* ul nodisc */
ul.listnoDisc {
	 line-height:1;
}
ul.listnoDisc li {
	list-style-type: none;
}
.list_uline li{
	border-bottom: 1px solid #ddd;
	margin-bottom: 0.3em;
	padding-bottom: 0.3em
}


/* ul disc */
ul.list li {
	list-style-type: none;
	margin-bottom: 0.7em;
	padding-left: 3em; /*1em（1文字）分、右に動かす*/
    text-indent: -3em; /*最初の行だけ1em（1文字）分、左に動かす*/
}
/* ul list_center */ 
ul.list_center li {
	line-height: 1.8;
	text-align: center;
}
/* ul list_inline */ 
ul.list_inline li {
	text-align: center;
	line-height: 2;
	font-size: 12px;
	display: inline-block
}
/* ol decimal */
ol.listDecimal {
	padding-left:1.5em;
	text-indent:-1.5em;
	line-height: 1;
}
ol.listDecimal li {
	list-style-type:decimal;
	padding: 0;
	margin: 0;
}


/* -----------------------------------------------
 text module
-------------------------------------------------- */
/*見出し*/
h1, h2, h3, h4, h5 {
  line-height: 1.4;
  letter-spacing: 1px;
  display: block;
  width: 100%
}
h3[ttl]{
  position: relative;
  padding: .75em 1em .75em 1em;
  text-align: left
}
/*小さい文字*/
.text_small,.text_small a {
	font-size: 0.75em;
	line-height: 1.6
}
/*左寄せ、右寄せ、中央寄せ*/
.alignL {text-align:left !important;}
.alignR {text-align:right !important;}
.alignC {text-align:center !important;}
.container-fluid.alginC p{text-align: center;}
.container.alginC p{text-align: center;}
.row.alginC p{text-align: center;}

/*下線*/
.uLine {
	padding-bottom: 1em;
	margin-bottom: 1em;
	border-bottom: 1px solid #CCC;
}

/* -----------------------------------------------
 margin style
-------------------------------------------------- */
.mt0{ margin-top:0rem !important; }
.mt1{ margin-top:1rem !important; }
.mt2{ margin-top:2rem !important; }
.mt3{ margin-top:3rem !important; }
.mt4{ margin-top:4rem !important; }
.mt5{ margin-top:5rem !important; }
.mt6{ margin-top:6rem !important; }
.mt7{ margin-top:7rem !important; }

.mb0{ margin-bottom:0 !important; }
.mb1{ margin-bottom:1rem !important; }
.mb2{ margin-bottom:2rem !important; }
.mb3{ margin-bottom:3rem !important; }
.mb4{ margin-bottom:4rem !important; }
.mb5{ margin-bottom:5rem !important; }
.mb6{ margin-bottom:6rem !important; }
.mb7{ margin-bottom:7rem !important; }

/* -----------------------------------------------
 padding style
-------------------------------------------------- */
.pt0{ padding-top:0rem !important; }
.pt1{ padding-top:1rem !important; }
.pt2{ padding-top:2rem !important; }
.pt3{ padding-top:3rem !important; }
.pt4{ padding-top:4rem !important; }
.pt5{ padding-top:5rem !important; }
.pt6{ padding-top:6rem !important; }
.pt7{ padding-top:7rem !important; }

.pb0{ padding-bottom:0rem !important; }
.pb1{ padding-bottom:1rem !important; }
.pb2{ padding-bottom:2rem !important; }
.pb3{ padding-bottom:3rem !important; }
.pb4{ padding-bottom:4rem !important; }
.pb5{ padding-bottom:5rem !important; }
.pb6{ padding-bottom:6rem !important; }
.pb7{ padding-bottom:7rem !important; }

/* -----------------------------------------------
 hover
-------------------------------------------------- */
.hov_mov:hover {
	transform: translate(2px,2px);
	transition: all 0.1s;
	cursor: pointer;
}
/* -----------------------------------------------
 Button
-------------------------------------------------- */
.button {
	display: inline-block;
	width: auto;
	text-align: left;
	text-decoration: none;
	outline: none;
	padding: 1rem 3rem;
	font-size: 1rem;
	position: relative;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button2::before,
.button2::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button {
	line-height: 1.2;
	margin-top: 2em;
	font-size: 0.8125em;
}
.button:after {
    content: "\f0da";
   font-family: "Font Awesome 5 Free";
	font-weight: 900;
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 20;
	font-size: 0.625em
}
