@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto:100,400');
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,400,700');

/*
font-family: 'Montserrat', sans-serif;

*/
/*------------------------------------------
reset
------------------------------------------*/
body, div, p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
img {
max-width: 100%;
height: auto;
width/***/
: auto;
border: 0;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
address, caption, cite, code, dfn, em, strong, var {
font-style: normal;
font-weight: 400;
}
ol, ul {
list-style: none;
}
h1, h2, h3, h4, h5, h6, .title {
font-size: 100%;
font-weight: 700;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}

a img {
border: none;
}
a {
color: #83794D;
text-decoration: none;
outline: none;
}
a:visited {
color: #333;
text-decoration: none;
}
a.txtlink:link, a.txtlink:visited {
/* 	color:#3098E3;*/
text-decoration: underline;
}
a:hover, a:hover img {
filter: alpha( opacity=70);
-ms-filter: alpha( opacity=07);
-webkit-filter: alpha( opacity=70);
-moz-filter: alpha( opacity=70);
-o-filter: alpha( opacity=70);
opacity: 0.7;
transition: opacity .20s ease-in-out;
-ms-transition: opacity .20s ease-in-out;
-webkit-transition: opacity .20s ease-in-out;
-moz-transition: opacity .20s ease-in-out;
-o-transition: opacity .20s ease-in-out;
box-shadow: #000 0 0 0;
}
a:hover, a:active {
color: #89C5FF;
}
a:focus {
outline: none;
}
embed {
outline: none;
}
.clear {
clear: both;
font-size: 1px;
}
.cf:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
/* IE7,MacIE5 */
.cf { display: inline-block }
/* WinIE6 below, Exclude MacIE5 \*/
* html .cf { height: 1% }
.cf { display: block }
/**/
@media screen and (max-width:768px) {
body {
-webkit-text-size-adjust: 100%;
}
img {
max-width: 100%;
height: auto;
}
}


/*==================================================
common
==================================================*/
html {
font-size: 62.5%;
height: 100%;
}
body {
font-family: 'Roboto',"Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HiraKakuPro-W3", "メイリオ", Meiryo, "MS PGothic", Osaka, sans-serif;
color: #333;
font-size: 15px;
font-size: 1.5rem;
font-weight: 400;
line-height: 1.8;
}

#wrapper {
width: 100%;
background: url(../images/cmn_bg01.gif) repeat-x;
}

/*==================================================
header
==================================================*/

#header{
position:relative;
padding-top:25px;
}
#header .inner{
position:relative;
}

.logo{
position:absolute;
top:-25px;
left:50%;
margin-left: -220px;
z-index:999;
}
.logo a{
display:block;
width:420px;
height:141px;
background:url(../images/logo.png) no-repeat left top;
background-size:100%;
text-indent: 100%; 
white-space: nowrap; 
overflow: hidden; 
}
.logo a:hover{
opacity:1;
}
.spbtn{
display:none;
}
/*--------------------  START Media Queries  --------------------*/

@media (max-width: 768px) {
#wrapper {
background-size:auto 10px;
}
#header{
position:relative;
padding-top:15px;
}

.logo{
width:250px;
height:auto;
top:-20px;
left:50%;
margin-left: -125px;

}
.logo a{
width:250px;
height:80px;
}

.spbtn {
float: right;
position: relative;
display:block;
width: 42px;
height: 42px;
margin: 10px 10px 15px 0;
z-index: 999;

}
.spbtn span {
position: absolute;
display:block;
width: 24px;
height: 2px;
left: 9px;
transition: all 0.4s;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
background: #666;
}
.globalnavi-btn {
width: 42px;
height: 42px;
cursor:pointer;
}
.spbtn span:first-child {
top: 12px;
}
.spbtn span:nth-child(2) {
margin-top: -1px;
top: 50%;
}
.spbtn span:last-child {
bottom: 12px;
}
.open .spbtn span{
background: #fff;
}	
.open .spbtn span:first-child {
-webkit-transform: translateY(8px) rotate(45deg);
-moz-transform: translateY(8px) rotate(45deg);
-ms-transform: translateY(8px) rotate(45deg);
transform: translateY(8px) rotate(45deg);
}
.open .spbtn span:nth-child(2) {
opacity: 0;
}
.open .spbtn span:last-child {
-webkit-transform: translateY(-8px) rotate(-45deg);
-moz-transform: translateY(-8px) rotate(-45deg);
-ms-transform: translateY(-8px) rotate(-45deg);
transform: translateY(-8px) rotate(-45deg);
}
.globalnavi-btn a {
display: inline-block;
text-decoration: none;
/* safari hack */
}


}/*768px*/




/*==================================================
navi
==================================================*/
.globalnavi  {
width:100%;
height:96px;
z-index:-10;
background:#3D4784;
}
.globalnavi ul{
width:950px;
margin:0 auto;
}
.globalnavi ul li{
position: relative;
float:left;
width:125px;
z-index:2;
text-align:center;
}

.globalnavi ul li a,
.globalnavi ul li div{
display:block;
float:left; 
width:125px;
height:96px;
background:url(../images/cmn_navigtion.png) no-repeat;
}


.globalnavi ul li span{
position: relative;
width:125px;
font-size:0.8em;
z-index:-1;
}
.globalnavi ul li.gnavi02 {
margin-right:400px;
}

.globalnavi ul li a:focus{
/**/
cursor:pointer;
overflow: hidden;
/**/
}
.globalnavi ul li.gnavi01 a{
background-position:0 0;
}
.globalnavi ul li.gnavi02 a{
background-position:-125px 0;
}
.globalnavi ul li.gnavi03 a{
background-position:-250px 0;
}
.globalnavi ul li.gnavi04 a{
background-position:-375px 0;
}

.globalnavi ul li.gnavi01 a:hover,
.globalnavi ul li.gnavi01 a.navon{
background-position:0 -96px;
}
.globalnavi ul li.gnavi02 a:hover,
.globalnavi ul li.gnavi02 a.navon{
background-position:-125px -96px;
}
.globalnavi ul li.gnavi03 a:hover,
.globalnavi ul li.gnavi03 a.navon{
background-position:-250px -96px;
}
.globalnavi ul li.gnavi04 a:hover,
.globalnavi ul li.gnavi04 a.navon{
background-position:-375px -96px;
}


/*--------------------  START Media Queries  --------------------*/
@media screen and (min-width:768px){	
.globalnavi ul li a,
.globalnavi ul li div{
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
}
@media screen and (max-width:768px){	

.globalnavi  {
position: fixed;
display: table;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(53,69,135,.93);
visibility: hidden;
opacity: 0;
z-index:900;
}
.open .globalnavi {
-webkit-transition: all .5s;
transition: all .5s;
visibility: visible;
opacity: 1;
}
.globalnavi ul {
display: table-cell;
width:auto;
margin:auto;
vertical-align: middle;
}


.globalnavi ul li {
float:none;
width: auto;
text-align: center;
}
.globalnavi ul li.gnavi02 {
margin-right:auto;
}

.globalnavi ul li a,
.globalnavi ul li div {
float:none;
width:auto;
height: 80px;
line-height: 80px;
font-size:20px;
font-size:2rem;
color: #ffff;
-webkit-transition: all .5s;
transition: all .5s;
background:none;
}
.globalnavi ul li span{
position: relative;
width:auto;
z-index:1;
}

.globalnavi li a:hover {
color: #999;
}



.open .globalnavi ul li:nth-child(1) {
-webkit-transition: opacity 1s ease .5s;
transition: opacity 1s ease .5s;
}

.open .globalnavi ul li:nth-child(2) {
-webkit-transition: opacity 1s ease .6s;
transition: opacity 1s ease .6s;
}

.open .globalnavi ul li:nth-child(3) {
-webkit-transition: opacity 1s ease .7s;
transition: opacity 1s ease .7s;
}

.open .globalnavi li:nth-child(4) {
-webkit-transition: opacity 1s ease .8s;
transition: opacity 1s ease .8s;
}

.open .globalnavi ul li:nth-child(5) {
-webkit-transition: opacity 1s ease .9s;
transition: opacity 1s ease .9s;
}



}/*768px*/






/*==================================================
footer
==================================================*/
.rtop {
position: fixed;
bottom: 20px;
right: 20px;
}
.rtop img{
width:55px;
height:55px;
}

#footer{
background:#F5F4F0;
}
#footer .snslnk{
text-align:center;
padding:10px 0 30px;
background:#3B4388;
}
#footer .snslnk ul li{
display:inline-block;
margin:0 10px;
line-height:0;
color:#fff;
}
#footer .snslnk ul li p {
		display:inline-block;
		color:#fff;
	}
#footer .snslnk ul li span{
	display:inline-block;
	width:50px;
	height:50px;
	font-size:30px;
	font-size:3rem;
	
	margin-right:15px;
		line-height:50px;

color:#3B4388;
	border-radius:50px;
	vertical-align:middle;

    text-align: center;
		background:#fff;
}
	
	
.footer_inner{
width:100%;
padding:50px 0;
color:#333;
background:#f5f5f5 url(../images/cmn_ftr_line.png) repeat-x left top;
}
.cmgs{
padding:0 0 5px;
font-size:0.8em;
color:#fff;
}

.footer_navi{
display:table;
width:100%;
}
.footer_sec01,
.footer_sec02,
.footer_sec03{
display:table-cell;
border-left:1px solid #ccc;
padding:15px 38px 0;
vertical-align:top;
}
.footer_sec01{
width:215px;
}
.footer_inner .footer_sec02{
width:270px;
}
.footer_inner .footer_sec03{
width:230px;
border-right:1px solid #ccc;
}

.footer_map a{
display:inline-block;
width:213px;
padding:3px 0;
text-align:center;
background:#3D4784;
color:#FFF;
}


.footer_sec01 address{
margin:15px 0;
}
.footer_sec02{
margin-top:10px;
}
.footer_sec02 dl{
font-size:16px;
font-size:1.6rem;
}
.footer_sec02 dl dt{
font-weight:700;
color:#3D4784;

}
.footer_sec02 dl dd{

padding:0 0 10px 35px;
}
.footer_sec02 ul li dl dt:before{
content:"";
display: inline-block;
width:30px;
height: 30px;
margin-right:10px;
font-size:15px;
line-height:30px;
font-family: "Font Awesome 5 Free";
font-weight:normal;
font-style: normal;
color:#fff;
background:#3D4784;
border-radius:50px;
text-align:center;

/*
position:relative;
width:30px;
height: 30px;
top:10px;
margin-right:10px;*/
}


.footer_sec02 ul li.footicon01 dl dt:before{ 
content: "\f017";

}

.footer_sec02 ul li.footicon02 dl dt:before{
content: "\f073";
}
.footer_sec02 ul li.footicon03 dl dt:before{
content: "\f095";
font-weight:900;
transform: scale(-1, 1);
}

.footer_sec03 ul li{
margin-bottom:25px;
}



.footer_sec03 ul li a:before{
content:"";
display: inline-block;
width:15px;
height: 10px;
background:url(../images/common_btm_arrow.png) no-repeat left center;
}

.footer_sec03 ul li a{
text-decoration:none;
color:#3D4784;
}
.footer_sec03 ul li a:hover{
opacity:0.7;
}

.footer_sec03 ul li a strong{
font-weight:bold;
font-size:1.1em;
}
.copyright p{
width:100%;
padding:5px 0;
color:#fff;
text-align:center;
font-size:0.8em;
background: #3B4388;
}

.copyright{
width:100%;
padding-bottom:15px;
background: url(../images/cmn_bg01.gif) left bottom;
}

/*--------------------  START Media Queries  --------------------*/

@media (max-width: 768px) {

.footer_navi{
display:block;
}
.footer_sec01,
.footer_sec02,
.footer_sec03{
display:block;
border-left:none;
border-bottom:1px solid #ccc;
padding:10px 0 0;
vertical-align:top;
text-align: center;
}
.footer_sec01{
width:auto;
border-bottom:none;
}
.footer_inner .footer_sec02{
width:auto;
}
.footer_inner .footer_sec03{
width:auto;
border-right:none;
border-bottom:none;
}
.footer_sec02 ul,
.footer_sec03 ul{
width:230px;
margin:0 auto;
text-align:left;
padding:10px 0;
}
.footer_sec02 ul li{
margin-bottom:10px;
}
.footer_sec02 dl dt{
display:inline;
padding:2px 0 3px 8px;
font-size:1.1em;
font-weight:bold;
color:#3D4784;
}
.footer_sec02 dl dd{
display:inline;
padding:0 0 0 15px;
font-size:1.1em;
}

.footer_sec03 ul li{
margin-bottom:5px;
}



}/*768px*/

/*==================================================
contents
==================================================*/
#contents{
clear:both;
margin-top:60px;
}
.inner{
width:950px;
margin:0 auto;
}
.txt01{
width:100%;
}

#maincontents{
width:950px;
margin:50px auto;
}
.titlewrap{
padding:50px 0 25px;
text-align:center;
background:url(../images/htitltbg.jpg) no-repeat top left;
background-size: cover;
}
.cont_title{
clear:both;
text-align:center;
margin:50px 0;
}
.mt60{
margin-top:60px;
}

.mt100{
margin-top:100px;
}

.mt150{
margin-top:150px;
}
/*--------------------  START Media Queries  --------------------*/

@media (max-width: 768px) {
.inner{
width:auto;
margin:0 auto;
}
#maincontents{
width:auto;
margin:50px auto;
padding:0 20px;
}
}/*768px*/




/*==================================================
menu
==================================================*/
#menu ul{
float:left;
width:420px;
}

#menu .menu_left{
margin-right:100px;
}
#menu ul li{
margin-bottom:30px;
}

#menu ul li dt{
margin-bottom:10px;
padding-left:20px;
font-weight:bold;
font-size:1.2em;
color:#3B4388;
border-bottom:1px dotted #123456;
background:url(../images/menu_icon01.gif) no-repeat left center;
}
.menu_caut{
display: table;
margin-bottom:50px;
padding:30px;
background:
url(../images/menu_icon01.gif) repeat-x top left,
url(../images/menu_icon01.gif) repeat-x bottom left;

}
.menuph{
width:30%;
}
.menu_caut p{
display: table-cell;
vertical-align: middle;
}




/*--------------------  START Media Queries  --------------------*/

@media (max-width: 768px) {
#menu ul{
float:none;
width:100%;
}
#menu ul.globalnavi_left{
margin-right:0;
}
.menuph{
width:40%;
}
}/*768px*/

@media (max-width: 640px) {
.menu_caut{
display: block;
margin-bottom:50px;
padding:30px 20px;
background:
url(../images/menu_icon01.gif) repeat-x top left,
url(../images/menu_icon01.gif) repeat-x bottom left;

}
.menuph{
width:100%;
text-align: center;
}
.menu_caut p{
display: block;
}
}/*640px*/


/*==================================================
	top main
==================================================*/
#top_contents{
text-align:center;
}

.top_main{
position: relative;
}
.top_main .top_txt{
position: absolute;
width:100%;
top: 25%;

margin: 0 auto;
z-index:2;
}
.top_main .top_txt img{
text-align:center;
}
.top_main ul li{
width:100%;
height:450px;
}
.top_main ul li:first-child{
background:url(../images/top_main01.jpg) no-repeat center top;
background-size:cover;
}
.top_main ul li:nth-child(2){
background:url(../images/top_main02.jpg) no-repeat center top;
background-size:cover;
}
.top_main ul li:nth-child(3){
background:url(../images/top_main03.jpg) no-repeat center top;
background-size:cover;
}
.top_main ul li:nth-child(4){
background:url(../images/top_main04.jpg) no-repeat center top;
background-size:cover;
}
.top_main ul li:nth-child(5){
background:url(../images/top_main05.jpg) no-repeat center top;
background-size:cover;
}



/*--------------------  START Media Queries  --------------------*/

@media (max-width: 640px) {
.top_main ul li{
width:100%;
height:400px;
}
.top_main .top_txt{
padding:0 30px;
}
}/*640px*/

@media (max-width: 480px) {
.top_main ul li{
height:250px;
}
}/*480px*/



/*==================================================
	top navi
==================================================*/

#top_navi .inner{
padding-top:40px;
padding-bottom:40px;
}

#top_navi .top_menu .inner{
padding-top:50px;
padding-bottom:80px;
}


#top_navi h2{
width:100%;
text-align:center;
margin-bottom:50px;
letter-spacing:0.1em;
}
#top_navi h2 span{
display:block;
font-weight:700;
font-size:28px;
font-size:2.8rem;
font-family: 'Montserrat', sans-serif;
color:#3D4784;
}


/*--menu--*/
.top_menu{
background: url(../images/top_title_bg01.jpg);
background-size:cover;
text-align:center;
}
.top_menulist li{
display:inline-block;
margin:0 20px;
}


/*--shop--*/
.top_shop{
padding:30px 0;
background:#3D4784;
/*
background:url(../images/top_title_bg02.png);*/
}
.top_shop .inner{
width:90%;
padding:30px 10px;

background:#fff;
}
.top_shop h3{
color:#3D4784;

}
.top_shop .maptopsec{
margin:10px 0;
padding: 0 80px;
}
.top_shop .maptopsec .mapleft{
text-align:left;
margin-bottom:30px;
}

.top_shop .maptopsec .mapleftin{
float:left;
width:46%;
}
.top_shop .maptopsec .mapleftin+.mapleftin{
margin-left:8%;
}
.top_shop .maptopsec .mapright{
width:100%;
}
.top_shop .maptopsec .mapright iframe{
width:100%;
height:300px;
}
.top_shop .maptopsec .mapleftin dl dt{
padding:10px 0;
}

.route ul{
margin:20px 0;
}
.route ul li{
margin-bottom:10px;
}

.route ul li:before{
display:inline-block;
padding-right:10px;
font-size:18px;
font-family: "Font Awesome 5 Free";
font-weight:900;
font-style: normal;
color:#3D4784;
}
.route ul li:first-child:before{
content: "\f238";
}
.route ul li:last-child:before{
content: "\f1b9";
}
.route ul li span{
font-weight: 700;
color:#3D4784;

}
.route+h3{
margin-top:40px;
}

.cmntel{
font-size:25px;
font-size:2.5rem;
font-weight: 700;
color:#3D4784;
letter-spacing: 0.1em;
font-family: 'Montserrat', sans-serif;

}

.cmntel:before{
content: "\f095";
display:inline-block;
padding-left:15px;
font-family: "Font Awesome 5 Free";
font-weight:900;
font-style: normal;
transform: scale(-1, 1);
}


/*--------------------  START Media Queries  --------------------*/
@media (max-width: 768px) {
	
.top_shop .maptopsec{
margin:10px 0;
padding: 0 30px;
}

}/*768px*/




@media (max-width: 640px) {
#top_navi ul li ul.top_menulist li{
width:70%;
}
.top_shop .maptopsec .mapleftin{
float:none;
width:100%;
}
.top_shop .maptopsec .mapleftin+.mapleftin{
margin-left:0;
}
}/*640px*/

@media (max-width: 480px) {

.top_menulist li{
display:block;
width:60%;
margin:0 auto 20px;
}
#top_navi .top_menu .inner {
    padding-top: 30px;
    padding-bottom: 20px;
}

}/*480px*/







/*==================================================
price
==================================================*/
#price h3{
clear:both;
margin-bottom:30px;
text-align:center;
background:url(../images/price_line.gif) repeat-x left center;
}
#price h3 span{
display:inline-block;
padding:0px 30px;
font-size:1.3em;
background:#fff;
border-left:2px solid #878DB3;
border-right:2px solid #878DB3;
}

.price_left{
float:left;
margin-right:90px;
}


#price ul{
float:left;
width:430px;
}
#price ul li{
padding:20px 0;
border-bottom:1px dotted #123456;
}
#price ul li dl{
	display:table;
	width:100%;
	}
#price ul li dl dt,
#price ul li dl dd{
	display:table-cell;
	}
#price ul li dl dt{
width:340px;
padding:0 0 0 20px;
font-weight:bold;
font-size:1.1em;
color:#3B4388;
background:url(../images/menu_icon01.gif) no-repeat left center;
}
#price ul li dt span{
font-size:0.8em;
}

#price ul li dd{
	text-align:right;
	}

/*--------------------  START Media Queries  --------------------*/

@media (max-width: 768px) {
.price_left{
float:none;
margin-right:0;
}


#price ul{
float:none;
width:100%;
}
#price ul li dl dt{
width:70%;
}
#price ul li dl dd{
width:30%;
}
}/*768px*/
@media (max-width: 480px) {


#price ul li dl{
	display:block;
	width:100%;
	}
#price ul li dl dt,
#price ul li dl dd{
	display:block;
		width:100%;
		}
		#price ul li dd{
	text-align:left;
	padding-left:20px;
	}

}/*480px*/

/*==================================================
	shop
==================================================*/

#shop .top_shop{
margin-top:80px;
    padding: 5px;
    background: #3D4784;
}
#shop .top_shop .inner {
    width: 100%;
    padding: 30px 10px;
    background: #fff;
}


.shopsect{
display:table;
width:100%;
}
.shopsect+.shopsect{
	margin-top:20px;
	}
.shopsect .shoptxt,
.shopsect .shopph{
display: table-cell;
vertical-align: middle;
}
.shopsect .shoptxt{
width:60%;
padding-right:10%;
line-height: 2;
}
.shopsect .shopph+.shoptxt{
padding-left:10%;
padding-right:0%;

}
.shopsect .shopph{
width:40%;
}


/*--------------------  START Media Queries  --------------------*/

@media (max-width: 480px) {
.shopsect{
display:block;
}
.shopsect+.shopsect{
	margin-top:20px;
	}
.shopsect .shoptxt,
.shopsect .shopph{
display:block;
}
.shopsect .shoptxt{
width:auto;
padding-right:0%;
line-height: 2;
}
.shopsect .shopph+.shoptxt{
padding-left:0%;
padding-right:0%;

}
.shopsect .shopph{
width:80%;
margin:30px auto;
}
.shopsect:nth-child(2) .shopph{
display:none;
}
}/*480px*/


/*==================================================
cf
==================================================*/

#footer .snslnk:after,
.footer_inner:after,
#maincontents:after,
.inner:after,
#menu ul li:after,
.mapsec:after{
content: "";
display: block;
clear: both;

}

#footer .snslnk,
.footer_inner,
#maincontents,
.inner,
#menu ul li,
.mapsec{
min-height: 1%;  /* for Firefox　*/
zoom: 1;
}