/*◆◇◆以下はスマホ用のCSS◆◇◆*/
@media screen and (max-width : 501px){



/*▼サンプルの動画関連*/
.video_wrapper_smp {
    position: relative;
    width: 100vw;
    height: 72vh;
    overflow: hidden;
}

.video_wrapper {
    display: none;
}


.video_wrapper_smp > video {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
}

.lines {
    z-index: 2;
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-image: url("../home/img/lines.png");
    background-repeat: repeat;
    opacity: 0.75;
}

.ovt_smp {
    z-index: 3;
    width: 70vw;
    position: absolute;
    top: 25%;
    left: 15%;
}

/*▲サンプルの動画関連*/










#content {
	width: 98vw;
	margin: 0 auto 0 auto;
	overflow: hidden;/*スマホ閲覧時の左右の微妙な隙間をなくす*/
}



a#tel {
	width: 56vw;
	height: 50px;
	line-height: 50px;
	font-size: 1.6rem;
	text-align: center;
	background-color: #828282;
	margin: 50px auto 0px auto;
	color: #ffffff;
	text-decoration: none;
    display: block;
}



p#intro {
    width: 85vw;
	margin: 50px auto 50px auto;
}



#service {
    width: 48vw;
    float: left;
    margin-bottom: 30px;
}
#about {
    width: 48vw;
    float: right;
    margin-bottom: 30px;
}
#contact {
    width: 48vw;
    float: left;
    margin-bottom: 50px;
}
#news {
    width: 48vw;
    float: right;
    margin-bottom: 50px;
}

.select_image {
    width: 47vw;
    border: #000000 solid 1px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin: 0 auto 0 auto;
    background-image: url("../home/img/karakusa.svg");
}
.select_image img {
    width: 27vw;
    margin: 0 10vw 0 10vw;
}
p.select_intro {
    width: 47vw;
    text-align: center;
    margin: 20px auto 20px auto;
}
p.goto_detail {
    width: 35vw;
    height: 20px;
    text-align: center;
    line-height: 20px;
    margin: 0 auto 0 auto;
    border: solid 1px #000000;
}



#latest_news {
	width: 97vw;
    border: 1px solid #c8c8c8;
    margin: 0px auto 100px auto;
}



.e_tbd {
    width: 85vw;
    margin: 9px 9px 0px 9px;
    border-bottom: 1px solid #c8c8c8;
    padding: 9px 16px 16px 16px;
}



p.e_title {
    font-size: 1.4rem;
    line-height: 18px;
    margin-bottom: 10px;
}
p.e_body {
    font-size: 1.2rem;
    line-height: 16px;
    margin-bottom: 8px;
}
p.e_date {
    font-size: 1.0rem;
    line-height: 18px;
    margin-bottom: 0px;
}



#erase_border {
    height: 1px;
    background-color: #FFFFFF;
    margin-top: -1px;
}



}










/*◆◇◆以下はPC用のCSS◆◇◆*/
/*ビューエリアの最小幅がこのサイズより大きい場合に以下のスタイルを適用*/
@media screen and (min-width : 500px){



/*▼サンプルの動画関連*/
.video_wrapper {
    position: relative;
    width: 100vw;
	min-width: 1200px;/*ipad対応用*/
    height: 72vh;
    overflow: hidden;
}

.video_wrapper > video {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
}

.lines {
    z-index: 2;
    position: relative;
    width: 100vw;
	min-width: 1200px;/*ipad対応用*/
    height: 72vh;
    overflow: hidden;
    background-image: url("../home/img/lines.png");
    background-repeat: repeat;
    opacity: 0.75;
}

.ovt {
    z-index: 3;
    position: absolute;
    width: 100vw;
	min-width: 1200px;/*ipad対応用*/
    height: 36vh;
    left: 0vw;
    top: 22vh;
}
.ovt img {
    width: 100vw;
	min-width: 1200px;/*ipad対応用*/
    height: 36vh;
}

.video_wrapper_smp {
	display: none;
}
/*▲サンプルの動画関連*/



#content {
	width: 1200px;
	margin: 0 auto 0 auto;
}



a#tel {
	width: 460px;
	height: 100px;
	line-height: 100px;
	font-size: 30px;
	letter-spacing: 2px;
	text-align: center;
	background-color: #828282;
	margin: 120px auto 0px auto;
	color: #ffffff;
	text-decoration: none;
    display: block;
}



p#intro {
    width: 505px;
    height: 287px;
	margin: 120px auto 120px auto;
}



#service {
    width: 576px;
    float: left;
    margin: 0px 48px 120px 0px;
}
#about {
    width: 576px;
    float: left;
    margin: 0px 0px 120px 0px;
}
#contact {
    width: 576px;
    float: left;
    margin: 0px 48px 120px 0px;
}
#news {
    width: 576px;
    float: left;
    margin: 0px 0px 120px 0px;
}

.select_image {
    width: 184px;
    height: 33px; /*344-155*/
    border: #000000 solid 1px;
    padding: 155px 195px 155px 195px;
    background-image: url("../home/img/karakusa.svg");
}
p.select_intro {
    text-align: center;
    font-size: 18px;
    line-height: 28px;
    margin: 20px 0px 20px 0px;
}
p.goto_detail {
    width: 459px;
    height: 44px;
    text-align: center;
    line-height: 44px;
    margin: 0 auto 0 auto;
    border: solid 1px #000000;
    font-size: 20px;
}



#latest_news {
	width: 1198px;
    border: 1px solid #c8c8c8;
    margin-bottom: 200px;
}



.e_tbd {
    width: 1148px;
    margin: 9px 9px 0px 9px;
    border-bottom: 1px solid #c8c8c8;
    padding: 9px 16px 16px 16px;
}



p.e_title {
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 10px;
}
p.e_body {
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 8px;
}
p.e_date {
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0px;
}



#erase_border {
    height: 1px;
    background-color: #FFFFFF;
    margin-top: -1px;
}



}