/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}


nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}
li{
    list-style: none;
}
a{
  -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease; 
  text-decoration: none;
}
img{
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

.google_maps{
  padding:20%;
}

/* -------------------------------- 
common
 -------------------------------- */

html {
  font-size: 62.5%;
}
body {
  font-family: "Yu Mincho", "リュウミン R-KL", "Ryumin Regular KL", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 2.6rem;
  color: #2D2926;
}
a:hover{
  opacity: 0.7;  
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.btn{
  cursor: pointer;
}
.pc{
  display: block;
  }
.sp{
  display: none;
}



#pagetop {
    position: fixed;
    right: 20px;
    bottom: 20px;
    cursor: pointer;
    z-index: 999;
    background: rgba(0, 0, 0,0.8);
    width: 100px;
    height:100px;
    border-radius: 50%;
    padding: 0;
    color: #fff;
    font-size: 90%;
    text-align: center;
    line-height: 100px;
}

@media screen and (max-width: 768px) {
  .pc{
    display: none;
  }
    .sp{
      display: block;
  }

	br.sp{
		display: inline;
	}
  #pagetop {
    right: 2%;
    bottom: 2%;
    width: 80px;
    height:80px;
    border-radius: 50%;
    padding: 0;
    color: #fff;
    font-size: 70%;
    text-align: center;
    line-height: 80px;
  }
}



/* -------------------------------- 
header
 -------------------------------- */
header{
  height:70px;
  border-bottom:#e8e8e8 3px solid;
  background: #fff;
}
header .inner h1{
  margin:20px 0 0 35px;
  float: left;
}
header .btn_company{
  float: right;
}
header .btn_company a{
  background:#1F3973;
  line-height: 1.8rem;
  font-weight:bold;
  padding:25px 40px;
  color: #fff;
  display: block;
  position: relative;
}
header .btn_company a::after{
  content: "";
  width:12px;
  height:16px;
  background: url(../img/icon_arrow.png) center center no-repeat;
  padding-left:10px;
  display: inline-block;
  position: absolute;
  top:50%;
  margin-top:-9px;
}



/* -------------------------------- 
sec02
 -------------------------------- */

#sec02 .wrapper{
  width:100%;
  margin-bottom:70px;
  background: #fff;
  box-shadow: 10px 10px 15px -10px rgba(0,0,0,0.4);
  overflow: hidden;
  transition: 0.4s;
}
#sec02 .bukken_header {
  background: #D5CBB3;
	display: flex;
	justify-content: space-between;
}
#sec02 .bukken_header h3 {
	display: flex;
	align-items: center;
	font-size: 2.6rem;
	line-height: 1.4;
	padding: 0 0 0 60px;
	min-height: 100px;
	background: url(../img/bgh3_left.png) left center no-repeat;
}
#sec02 .bukken_header .plan {
	display: flex;
	align-items: center;
	padding: 0 0 0 60px;
	background: #80796B url(../img/bgh3_right.png) left center no-repeat;
}

#sec02 .bukken_header .planInner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-right: 20px;
	color: #FFFFFF;
	font-weight: normal;
}

#sec02 .bukken_header .planInner .madori {
	font-size: 3.8rem;
	padding-right: 5px;
}

#sec02 .bukken_header .planInner .plus {
	font-size: 1.6rem;
	line-height: 1.0;
}

#sec02 .bukken_header .planInner .plus span {
	display: block;
}

#sec02 .wrapper .wrap{
  display: flex;
  justify-content: space-between;
}
#sec02 .wrapper .wrap .photo{
  width: 30%;
}
#sec02 .wrapper .wrap  .info{
  width: 70%;
  padding:30px 40px;
  box-sizing: border-box;
}
#sec02 .wrapper .info .point_area {
	display: flex;
	justify-content: space-between;
}

#sec02 .wrapper .info .point_area .sub_photo {
	width: 27%;
}

#sec02 .wrapper .info .point_area .point_inner {
	text-align: left;
	width: 68%;
	border-bottom: 1px dotted #c1c1c1;
	padding-bottom: 10px;
}

#sec02 .wrapper .info .point_area .point_inner .h4_point {
	font-weight: normal;
	font-size: 1.8rem;
	color: #A08968;
}

#sec02 .wrapper .info .point_area .point_inner .point_txt {
	font-size: 1.5rem;
}
#sec02 .wrapper .info .point{
  display: flex;
  list-style: none;
  flex-wrap: wrap;
}
#sec02 .wrapper .info .point li{
  margin-right:5px;
  padding:5px 10px;
  display: flex;
  font-size:1.2rem;
  font-weight: 700;
  line-height: 1.4rem;
  color:#000;
  box-sizing: border-box;
}
#sec02 .wrapper .info .point li.teiki{
  background: #F4D1C9;
}
#sec02 .wrapper .info .point li.spec{
  background: #EDECD6;
}
#sec02 .wrapper .info .name{
  margin-top:25px;
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 2.4rem;
	padding-left: 10px;
	border-left: 5px solid #3A3030;
}
#sec02 .wrapper .info .copy{
  margin-top:5px;
  font-size: 1.8rem;
  line-height: 2.6rem;
}
#sec02 .wrapper .info .access{
  margin-top:10px;
  font-size: 1.3rem;
  line-height: 1.8rem;
	position: relative;
}
#sec02 .wrapper .info .access p+p{
  margin-top:6px;
}
#sec02 .wrapper .info .btnWrap{
  margin-top:20px;
  display: flex;
  -webkit-box-pack: justify;
     -ms-flex-pack: justify;
   justify-content: space-between;
}
#sec02 .wrapper .info .btnWrap .btn{
  width:49%;
  text-align: center;
}
#sec02 .wrapper .info .btnWrap .btn a{
  line-height: 1.6rem;
  font-weight:bold;
  padding:17px 5%;
  color: #fff;
  display: block;
  position: relative;
  box-sizing: border-box;
	font-size: 1.7rem;
}


#sec02 .wrapper .info .btnWrap .detail a{
  background:#A08968;
  color:#fff;
}
#sec02 .wrapper .info .btnWrap .res a{
  background:#B21818;
}
#sec02 .wrapper .info .btnWrap .detail a::after{
  content: "";
  width:10px;
  height:11px;
  background: url("../img/btn-after.svg")center center no-repeat;
  padding-left:10px;
  display: inline-block;
  position: absolute;
  top:50%;
	transform: translateY(-50%);
}
#sec02 .wrapper .info .btnWrap .res a::after{
  content: "";
  width:10px;
  height:11px;
  background: url("../img/btn-after.svg")center center no-repeat;
  padding-left:10px;
  display: inline-block;
  position: absolute;
  top:50%;
	transform: translateY(-50%);
}

#sec02 .wrapper .info .access .access_inner {
	display: flex;
	justify-content: flex-start;
  margin-top:25px;
	align-items: flex-start;
}

#sec02 .wrapper .info .access .access_inner .access_name2 {
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 2.4rem;
	padding-left: 10px;
	border-left: 5px solid #3A3030;
}

#sec02 .wrapper .info .access .access_inner .access_detail {
	margin-left: 50px;
}


#sec03{
  padding:0;
  background: #fff;
}
#sec03 h4{
  font-size:3.6rem;
  line-height: 4.2rem;
  color: #1f3973;
  letter-spacing: 5px;
  text-align: center;
}
#sec03 h4 span{
  margin-top:5px;
  font-size: 1.0rem;
  line-height: 1.2rem;
  color:#d2d2d2;
  display: block;
}

footer{
  padding:50px 0 10px;
  background: #222222;
}
footer .company{
  max-width: 300px;
  margin:0 auto;
}
footer .cv{
  max-width: 340px;
  margin:30px auto;
  display: flex;
    -webkit-box-pack: justify;
     -ms-flex-pack: justify;
   justify-content: space-between;
}
footer .cv li:first-child{
  margin-top:3px;
}
footer .cv li img{
  height:60px;
}
footer .copyright{
  font-size: 1.2rem;
  color:#fff;
  text-align: center;
}

@media screen and (max-width: 1280px) {

	#sec02 .wrapper .info .access .access_inner {
		display: block;
		margin-top:25px;
	}

	#sec02 .wrapper .info .access .access_inner .access_detail {
		margin-left: 0;
		margin-top: 10px;
	}
	
}

@media screen and (max-width: 768px) {


/* -------------------------------- 
header
 -------------------------------- */
header{
  height:55px;
}
header .inner h1{
  width:100%;
  margin:15px auto 10px;
  text-align: center;
}
header .btn_company{
  display: none
}

header .btn_company a{
  padding:15px 10%;
  font-size: 14px;
}
header .btn_company a::after{
  width:12px;
  height:16px;
  padding-left:10px;
  top:50%;
  margin-top:-9px;
}


/* -------------------------------- 
mv
 -------------------------------- */
#mv{
  background: none;
}
#mv h2{
    text-align: center;
    padding:0;
    width: 100%;
}


/* -------------------------------- 
sec01
 -------------------------------- */
#sec01{
  margin-top:10%;
  text-align: center;
  letter-spacing: 0.0px;
}
#sec01 h3{
  font-size:1.6rem;
  line-height: 2.4rem;
  letter-spacing: 0px;
}
#sec01 h4{
  margin-top:10%;
  font-size:2.8rem;
  line-height: 3.2rem;
}
#sec01 h4 span{
  font-size: 1.0rem;
  line-height: 1.2rem;
}


/* -------------------------------- 
sec02
 -------------------------------- */
#sec02{
  width:95%;
  margin:10% auto 0;
}

#sec02 .wrapper{
  margin-bottom:10%;
  border:1px solid #eaeaea;
}
#sec02 .bukken_header {
	display: block;
}
#sec02 .bukken_header h3 {
	align-items: center;
	font-size: 1.6rem;
	padding: 10px;
	min-height: auto;
	background: none;
}
#sec02 .bukken_header .plan {
	display: block;
	padding: 5px 10px;
	background: #80796B;
}

#sec02 .bukken_header .planInner {
	display: block;
	padding: 0;
}

#sec02 .bukken_header .planInner .madori {
	font-size: 1.2rem;
	padding-right: 0;
	display: inline-block;
}

#sec02 .bukken_header .planInner .plus {
	font-size: 1.2rem;
	display: inline-block;
}

#sec02 .bukken_header .planInner .plus span {
	font-size: 1.2rem;
	display: inline-block;
}
#sec02 .wrapper .wrap{
  display: block;
}
#sec02 .wrapper .wrap .photo{
  width: 100%;
  padding: 23% 0;
}
#sec02 .wrapper .wrap  .info{
  width:100%;
  padding:5%;
}
#sec02 .wrapper .info .point_area {
	display: block;
}

#sec02 .wrapper .info .point_area .sub_photo {
	width: auto;
	display: none;
}

#sec02 .wrapper .info .point_area .point_inner {
	text-align: left;
	width: auto;
}

#sec02 .wrapper .info .point_area .point_inner .h4_point {
	display: none;
}

#sec02 .wrapper .info .point_area .point_inner .point_txt {
	font-size: 1.3rem;
}
#sec02 .wrapper .info .name{
  margin-top:0;
  font-size: 1.8rem;
  line-height: 1.5;
	border-left: none;
	padding-left: 0;
}
#sec02 .wrapper .info .copy{
  margin-top:0;
  font-size: 1.4rem;
  line-height: 1.5;
}
#sec02 .wrapper .info .access{
	margin-top: 10px;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
#sec02 .wrapper .info .access p+p{
  margin-top:6px;
}
#sec02 .wrapper .info .btnWrap{
  margin-top:20px;
}
#sec02 .wrapper .info .btnWrap .btn{
  width:49%;
  text-align: center;
}
#sec02 .wrapper .info .btnWrap .btn a{
  padding:17px 0;
}

#sec02 .wrapper .info .access .access_inner {
}

#sec02 .wrapper .info .access .access_inner .access_name2 {
  margin-top:0;
  font-size: 1.8rem;
  line-height: 1.5;
	border-left: none;
	padding-left: 0;
}

#sec02 .wrapper .info .access .access_inner .access_detail p {
  font-size: 1.3rem;
  line-height: 1.8rem;
}


  
/* -------------------------------- 
sec03
 -------------------------------- */
#sec03{
  padding:0;
}
#sec03 h4{
  font-size:2.8rem;
  line-height: 3.2rem;
}
#sec03 h4 span{
  font-size: 1.0rem;
  line-height: 1.2rem;
}  

footer{
  padding:50px 0 10px;
  background: #222222;
}
footer .company{
  max-width: 240px;
  margin:0 auto;
}
footer .cv{
  max-width: 95%;
  margin:5% auto;
}
footer .cv li{
  width:90%;
  margin:0 auto;
}
footer .cv li a{
  display: block;
  text-align: center;
}

}


@media screen and (max-width: 468px) {

#sec02 .wrapper .photo{
  padding:23% 0;
}

#sec02 .wrapper .info .btnWrap{
  margin-top:20px;
  display: block;
}
#sec02 .wrapper .info .btnWrap .btn{
width: 100%;
}
#sec02 .wrapper .info .btnWrap .btn:last-child{
margin-top:10px;
}  
#sec02 .wrapper .info .btnWrap .btn a{
  font-size: 1.8rem;
  line-height: 1.8rem;
  padding:20px 10%;
  display: block;
}
  
}


/* -------------------------------- 
sec04
 -------------------------------- */
#sec04{background-image: url(../../shijonawate/img/magazine/magazine_bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: top center; padding: 5% 5%;}
#sec04 h4 {
    font-size: 3.6rem;
    line-height: 4.2rem;
    color: #1f3973;
    letter-spacing: 5px;
    text-align: center;
}
#sec04 h4 span {
    margin-top: 5px;
    font-size: 1.0rem;
    line-height: 1.2rem;
    color: #d2d2d2;
    display: block;
}
#sec04 h4 + p{text-align: center; margin-top: 2%; font-size: 1.9rem; color: #1f3973; font-weight: 600;}
#sec04 span.sub {
    margin-top: 15px;
    font-size: 1.0rem;
    line-height: 1.2rem;
    color: #d2d2d2;
    display: block;
    text-align: center;
}



.magazine{max-width: 1200px; margin: 2% auto 0; padding: 0 2%; font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;}

.box{background-color: #fff; padding: 10px 10px 25px; margin: 0 10px; transition: .3s; box-shadow: 4px 4px 8px -4px rgba(0,0,0,.2); position: relative; }
.box:hover{opacity: .7;}
.box a:focus{outline: none;}
.item{display: flex; justify-content: space-between; list-style: none; margin: 4%; align-items: center;}
.item .day{font-size: 13px; color: #2e2e2e; font-weight: 900; padding-left: 5px;}
.item .tag{background-color: #e9ecf1; color: #15327e; font-weight: 900; font-size: 14px; padding: 2px 5px;}
.box h5{padding: 5px 7px 0; color: #000; font-size: 16px; line-height: 1.5;}3% auto 0; font-weight: 500;}
.box .btn{
    background: #2e2e2e;
    line-height: 1.6rem;
    font-size: 1.4rem;
    font-weight: bold;
    padding: 10px 15%;
    color: #fff;
    margin: 15px auto 0;
    box-sizing: border-box;
    text-align: center;
    width: 70%;
    background: url(../../common/img/icon_arrow02.png) 90% 50% no-repeat, #2e2e2e;
    transition: 0.7s;
}
.box .btn:hover{
    background:  url(../img/icon_arrow02.png) 95% 50% no-repeat, #2e2e2e !important;
}
.slide-arrow{position: absolute; z-index: 999; width: 40px; cursor: pointer; transition: .3s;}
.slide-arrow:hover{opacity: .7;}
.next-arrow{top: 50%; right: -3%;}
.prev-arrow{top: 50%; left: -3%;}

@media screen and (max-width: 768px){
    #sec04{padding: 5% 5% 15%; background-image: url(../../shijonawate/img/magazine/magazine_bg_sp.jpg)}
   #sec04 h4,
    .magazine_mv h4{
    margin-top: 3%;
    font-size: 2.8rem;
    line-height: 3.8rem;
        letter-spacing: 5px;
} 
    #sec04 h4 span,
    .magazine_mv span{
    font-size: 1.0rem;
    line-height: 1.2rem;
        letter-spacing: 1px;
}
    #sec04 h4 + p,
    .magazine_mv h4 + p{margin-top: 4%; font-size: 1.3rem;}
    .magazine{max-width: 100%; margin: 8% auto 0; padding: 0 2%;}
    .box{padding:20px; margin: 0 10px;}
    .box:hover{opacity: 1;}
    .box h5{font-size: 16px; line-height: 1.5;}
    .txt{font-size: 14px; margin: 5% auto 0;}
    .box .btn{left: 25%;}
    .next-arrow{width:50px !important; right: -16px; margin-top:-25px;}
    .prev-arrow{width:50px !important; left: -16px; margin-top:-25px;}
    
    .magazine_mv{
        z-index: 0;
        overflow: hidden;
        background-color: rgb(255,255,255);
        position: relative;
        text-align: center;
        padding: 5% 0;
        color: #fff;
    }
    .magazine_mv::before{
        content: '';
        background-image: url(../../shijonawate/img/magazine/magazine_mv_sp.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: bottom center;
        opacity: 1;
        filter: blur(2px);
        position: absolute;
        top: -5px; left: -5px; right: -5px; bottom: -5px;
        z-index: -1;
    }
    #sec04 span.sub{color: #7993cc !important;}
/*
    .ttl_l{
        text-align: center;
        color: #fff;
        font-weight: 100;
        padding: 3% 0 10%;
        font-size: 2.3rem;
        letter-spacing: 4px;
        line-height: 1.3;
    }
    .ttl_s{font-size: 1.5rem; text-align: center; color: #fff; padding-top: 10%; letter-spacing: 1.6px;}
*/
}