@charset "UTF-8";

@charset "UTF-8";
.mb5 {
    margin-bottom: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb40 {
    margin-bottom: 40px;
}

.mb60 {
    margin-bottom: 60px;
}

.center {
    text-align: center;
}

.fade {
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-ms-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;						
	transition: 0.2s ease-in-out;	
}

.fade:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

.flex {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap; 
	flex-wrap: wrap;
}

.flex01 {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
	flex-wrap : wrap;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	align-content: space-between;
}

.flex02 {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
	flex-wrap : wrap;
	-ms-flex-direction : row-reverse;
    -webkit-flex-direction : row-reverse;
	flex-direction : row-reverse;
	-ms-flex-pack:justify;
	justify-content:space-between;
	align-content: space-between;
}

.flex-center {
    justify-content: center;
    align-items: center;
}

/*section*/
.section01 {
    clear: both;
    width: 100%;
    padding-top: 60px;
    padding-bottom: 60px;
}

.section01 img {
    width: 100%;
}

/*box*/
.box1480 {
	clear: both;
	width: 100%;
	max-width: 1520px;
	margin: 0 auto;
    padding-left: 20px;
	padding-right: 20px;
	position: relative;
    box-sizing: border-box;
}

.box1140 {
	clear: both;
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
    padding-left: 20px;
	padding-right: 20px;
	position: relative;
    box-sizing: border-box;
}

.box800 {
	clear: both;
	width: 100%;
	max-width: 840px;
	margin: 0 auto;
    padding-left: 20px;
	padding-right: 20px;
	position: relative;
    box-sizing: border-box;
}

/*mv */
header#pattern2 {
    background: #158200;
} 
.mv_top {
    padding-top: 140px;
}

#mv.slide05::after  {
    max-height: 460px !important;
}

#mv .mv_img,#mv.slide05 {
    max-height: 460px !important;
}

#mv,.slide05{
    max-height: 460px !important;
    padding: 0 !important;
}

.mv_img,.pos_c {
    height:auto;
    max-height: 460px !important;
    padding: 0 !important;
}


.mv_box {
    padding: 20px;
    box-sizing: border-box;
}

.mv_box #mv_outer {
    width:50%;
    box-sizing: border-box;
}

.mv_box .mv_left {
    width:50%;
    padding: 40px;
    box-sizing: border-box;
}

.button01 img {
    width: 100%;
    max-width: 440px;
}

.mv_tel {
    font-size: 1.6em;
}

.mv_tel svg {
    max-width: 20px;
    max-height: 20px;
    margin-right: 10px;
}

.mv_tel svg use {
    position: relative;
    top: 5px;
    left: 5px;
}

@media (max-width: 1080px){
.mv_top {
    padding-top: 80px;
}

#mv .mv_img {
    max-height: 100% !important;
}

#mv,.slide05,#mv_img,.pos_c {
    max-height: 100% !important;
    padding: 0 !important;
}

.mv_box {
    padding: 0;
}

.mv_box #mv_outer {
    width:100%;
    height: 100%;
}

.mv_box .mv_left {
    width:100%;
    padding: 20px;
}
}

/*arrow*/
.arrow {
    clear: both;
    padding: 20px;
    text-align: center;
}

.arrow img {
    max-width: 210px;
}

/*modal_bt*/
ul.flex01,ul.flex01 li {
    list-style: none !important;
    list-style-type: none !important;
}

.modal_bt {
    width: 18.5%;
    box-sizing: border-box;
}

.modal_bt a {
    margin-bottom: 20px;
    padding: 15px 5px;
    text-align: center;
    color: #fff;
    display: block;
    border-radius: 3px;
    background: #9A3516;
    box-sizing: border-box;
}

@media (max-width: 768px){
.modal_bt {
    width: 48% !important;
}
}

/* モーダル全体(背景＋本体) */
.modal{
    display: none;
    position: fixed;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
}

/* モーダル背景 */
.modal-bg{
    position: absolute;
    height: 100vh;
    width: 100%;
    background: rgba(0, 0, 0, 0.8);
}

/* モーダル本体 */
.modal-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow-y: scroll; /* はみ出た部分はスクロールさせる */
    height: auto;/* これが無いと「overflow:scroll」が利かない */
    width: 60%;/* これが無いと「overflow:scroll」が利かない */
    background: white;
    padding: 20px 40px 40px 40px;
}

/* モーダルウィンドウ表示中に記事本体を固定 */
body.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
}

/*モーダルコンテンツ*/
.modal_close {
    text-align: right;
    margin-bottom: 10px;
}
.modal-left {
    width: 35%;
}

.modal-left img {
    width: 100%;
}

.modal-right {
    width: 60%;
}

.modal-right h3 {
    font-size: 1.2em;
    margin-bottom: 20px;
} 

@media (max-width: 768px){
.modal-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow-y: scroll; /* はみ出た部分はスクロールさせる */
    height: 70%;/* これが無いと「overflow:scroll」が利かない */
    width: 80%;/* これが無いと「overflow:scroll」が利かない */
    background: white;
    padding: 10px 20px 20px 20px;
}

.modal-left {
    width: 100%;
    margin-bottom: 20px;
}

.modal-right {
    width: 100%;
}

.modal-right h3 {
    font-size: 1.1em;
} 
}