@charset "utf-8";
/* CSS Document */
/*-------------------------------------------------Reset*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, address, cite, code, del, em, img, q, s, samp,
strong, dl, dt, dd, ol, ul, li,
fieldset, form, label, 
table, caption, tbody, tfoot, thead, tr, th, td{ margin: 0; padding: 0; font-style:normal; zoom:1; }
li{ list-style-type:none;}
img{ border:0;}
html{}
body{ font-size: 14px; color: #3D3D3D; font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', メイリオ, Meiryo, 'ＭＳ Ｐゴシック', sans-serif;  line-height: 1.6; background-image: url(none); }
a:link{ color: #3D3D3D;}
a:visited{ color: #3D3D3D; }
a:hover{ color: #3D3D3D; text-decoration: none; }
a:active{ color: #3D3D3D;  }
.Mincyo{font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', メイリオ, Meiryo, 'ＭＳ Ｐゴシック', sans-serif; letter-spacing: -1px; font-weight:normal; }

.pagetop{	display: none;
	position: fixed;
	bottom: 30px;
	right: 0px;}

.pagetop a{ display:block;}
.pagetop{ width:80px; height:80px; margin: 0 40px 0 0; display:table;z-index:9999999;}
.pagetop a{ font-size:10px; background-color:#000; display:table-cell; vertical-align:middle; border-radius: 50%; width:80px; height:80px; filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; color:#FFFFFF; text-decoration:none; text-align:center; letter-spacing: 1px; }
.pagetop a:before{ content: "\f106"; font-family: FontAwesome; padding:0 0 3px 0; display:block; font-size:40px; line-height: 0.8; text-align: center; }
.pagetop a:hover{filter: alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.4;}

.wrap{width: 100%; overflow: hidden;}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
}

.fullheight {
    height: 100%;
}

.brochures {height: 44px; width: 302px;overflow: hidden; position: relative; margin: -60px 35px 6px auto; }
.brochures img{
  border: none;
  /*margin-top: -44px;*/
}
.brochures:hover img{
  margin-top: -44px;
}

/*------------------------------------setting*/
.sec{ width:960px; margin: 0 auto; overflow:hidden;}
.sec h2{ text-align:center; padding-bottom:50px; }
.sec h2 p{ padding-bottom:15px;}
.sec h2 p + p{ font-size: 14px; font-weight:normal;}
.secClear{ overflow:hidden;}
a{-webkit-transition: all .3s ease-out; }

.contents{ padding:50px 0 60px 0; }

.lines-on-sides{ position:relative;}
.lines-on-sides:before {
    content: "";
    display: block;
    border-top: solid 2px #3D3D3D;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 45%;
    z-index: 1;
}
#LowerMain h2.lines-on-sides:before{ margin-top:-0.4em;}
.lines-on-sides span {
    background: #fff;
    padding: 0 20px;
    position: relative;
    z-index: 5;
}



/*----------------------------------------MainVisual*/
#MainVisual{ position:relative;min-width:960px;margin-top: -25px;}
#MainVisual #container{ height:450px; width:100%; background-color: #DEECF8;}
.skippr > div{ height:450px;}
#theTarget{width: 65%; min-width: 960px; margin:auto;}
#InSite{margin: auto; text-align: center;}


#Head{ height:96px; background-image: url(../images/opavity_blue85.png); position:absolute; top:0; width:100%; left:0; z-index:999;}
#Lower #Head{ background-image:none; background-color:#3C6689; position:relative;}
#HeadIn{ margin:0 auto; padding:0 0 10px 20px; overflow:hidden; width:940px; }
#HeadIn h2{ width:64px; float:left; padding-top:20px;}
#HeadIn  h1{ float:left;  padding-top:20px; }
#HeadIn  h1 p{ display:inline-block; padding-top:8px;}


#HeadIn .menu{ text-align:right; float:right; padding-top:50px; padding-right: 20px;}

#HeadIn .menu ul{  text-align:right; color:#fff;}
#HeadIn .menu li{display:inline-block; }
#HeadIn .menu li a{ font-weight:normal; color:#fff;}
#HeadIn .menu li + li{ padding-left:10px;}
#HeadIn .menu li + li:before{content:url(../images/menu_linewh.png); display:inline-block; padding-right:10px;}

#HeadIn .btn{ display: table; float:right; width:96px; height:96px; }
#HeadIn .btn a{ display:table-cell; width:96px; text-align:center; text-decoration:none; background-color:#DBD6D6; color:#1A4B74; height:96px; vertical-align:middle; font-size:14px; }
#HeadIn .btn a:after{content:"\f107"; font-weight:bold; display:block; text-align:center; color:#1A4B74;font-family:FontAwesome;}
#HeadIn .btn a:hover{ background-color:#C2DDF4; }
#head_margin {margin-top: 120px;}

#MainVisual_ttl{ position:absolute; top:200px; width: 960px; z-index: 9999; left:50%; margin-left:-480px; text-align:left;}
#MainVisual_ttl dt {}
#MainVisual_ttl dd{padding-top:15px;}

#MainVisual #container p{
	position: absolute;
	z-index: 9999;
	left: 558px;
	top: 331px;
	margin-left: -480px;
	text-align: left;
	width: 670px;
}

.main_txt{
	position: absolute;
	z-index: 9999;
	left: 64%;
	top: 170px;
	text-align: left;
	width: 400px;
}

/*----------------------------------------Service*/
#Service{ background-color:#fff; width:1020px; position:relative; margin:0 auto 80px auto; z-index:9999; }
#Service .sec{ padding-top:40px; }

#Service .Item {}
#Service .Item + .Item{ margin-top:50px; }
#Service .Item h3{ background-color:#1A4B74; display:table; width:100%; padding:10px 0 5px 0; margin-bottom:20px;}
#Service .Item h3 p{ display:table-cell; text-align:left; vertical-align:middle; padding-left:20px;}
#Service .Item h3 p +p{ text-align:right; color:#FFFFFF; font-size:14px; font-weight:normal; vertical-align:middle; padding-right:10px;}

#Service .Item .secClear{ display: table; width:100%; table-layout:fixed;}
#Service .Item .secClear + .secClear{ margin-top:20px;}
#Service .Item .Entry{ display:table-cell; text-align:center; padding-right:10px;}
#Service .Item .Entry_block { display:block; text-align:center; padding-right:0px;}
#Service .Item .Entry + .Entry{ padding-left:10px; padding-right:0;}
#Service .Item .EntryIn{ border: 1px solid #CCC; padding:20px 15px;}

#Service .Item .Entry .icon{padding-bottom:10px;}
#Service .Item .Entry h4{ font-size:24px; font-weight:normal; padding-bottom:0px; }
#Service .Item .Entry_block h4{ font-size:24px; font-weight:normal; padding-bottom:0px; }
#Service .Item .secClear + .secClear h4{ font-size:20px;}
#Service .Item .Entry .txt{ text-align:left; padding-top: 10px; }
#Service .Item .Entry .caution{ text-align:center; padding-bottom:15px;}

#Service .Point{ padding-top:10px; }
#Service .Point dt{ font-size:18px; padding-bottom: 5px; }
#Service .Point dd{ display:table; width:100%;}
#Service .Point dd p.txt{ display:table-cell; vertical-align: top; }
#Service .Point dd p.linkBtn{ display:table-cell; padding-left:20px; width:170px; }
#Service .Point dd p.linkBtn a{ display:block; background-color:#EAEAEA; text-decoration:none; padding:10px; text-align:center; font-weight:bold; }
#Service .Point dd p.linkBtn a:before{content:"\f105"; font-family:FontAwesome;padding-right:5px;}
#Service .Point dd p.linkBtn a:after{ content:url(../images/icon_pdf.png); padding-left:3px;}
#Service .Point dd p.linkBtn a:hover{ background-color:#D7D7D7; }

#Service .BrandList{ display: flex; flex-wrap: wrap;}
#Service .BrandList dl{ width:152px; float:left; display: block; }
#Service .BrandList dt{ padding-top:8px;}
#Service .BrandList dd{ padding-bottom:8px; font-size:12px;}
#Service .BrandList dd:before{content:"\f0d8"; font-family:FontAwesome;padding-right:2px;} 
#Service .BrandList dl + dl{}
.other_btm_p{text-align: right; margin-right: 30px;}

/*----------------------------------------Campaign*/
#Campaign { background-color:#DEECF8;}
#Campaign .Entry{ width:450px; float:left; margin:0 15px; background-color:#FFF; margin-bottom:20px;padding-bottom: 15px;}
#Campaign .EntryIn{ padding:0 18px; display:block; display: table-cell;}
#Campaign .Entry .photo{vertical-align:top;}
#Campaign .Entry .photo .img{}
#Campaign .Entry .photo .caption{ font-size:12px; padding:0 18px 0 0; text-align:right;}
#Campaign .Entry .txt{vertical-align:top;}
#Campaign .Entry .icon{ margin-bottom:5px;}
#Campaign .Entry .icon li{display:inline-block; font-size:12px; background-color:#F0E6C1; padding:0 8px;float: right; margin: 0 5px 0 0;}
#Campaign .Entry .txt h3{ font-size:18px; padding:15px; z-index: 9999;}
#Campaign .Entry .txt .comment{ padding-bottom:10px;padding: 0 24px; text-align: left;}
#Campaign .Entry .txt {text-align: center;}
#Campaign .Entry .txt .data .day{ font-size:12px;text-align: center;}
#Campaign .Entry .txt .data .day_ex{ font-size:12px;}
#Campaign .day{margin: 15px 0 7px 0;}
#Campaign .comment_ss {font-size:12px;}
#Campaign .Entry .txt .data .price{ font-size:16px; font-weight:bold; color:#FF9900;text-align: center;}

/*----------------------------------------Menu*/
#Menu{ text-align:center;border-bottom: 1px solid #3D3D3D; }
#Menu h3{ text-align:center; padding:30px 0 40px 0; }
#Menu .tel{ width:440px; text-align:center; float:left; }
#Menu .tel + .tel{ float:right;}
#Menu .tel dt{ padding-bottom:18px; }
#Menu .tel dd{}
#Menu.tel dd p{ padding-bottom:20px;}
#Menu .tel dd p + p{}

#Menu .atte{ border: 1px solid #CCC; padding:10px; width: 960px; margin: 20px auto 0 auto; text-align: left; }
#Menu .atte dl{}
#Menu .atte dt{ font-weight:bold;}
#Menu .atte dd{ padding-top:5px;}
#Menu .atte dd + dd{ }
#Menu .atte dd:before{content:"\f046"; font-family:FontAwesome;padding-right:5px;}

/*----------------------------------------Menu*/
#Online { background-color:#DEECF8; margin-top: 50px; }
#Online .Entry{ width:450px; float:left; margin:0 15px; background-color:#FFF; margin-bottom:20px;padding-bottom: 15px;}
#Online .EntryIn{ padding:0 18px; display:block; display: table-cell;}
#Online .Entry .photo{vertical-align:top;}
#Online .Entry .photo .img{}
#Online .Entry .photo .caption{ font-size:12px; padding:0 18px 0 0; text-align:right;}
#Online .Entry .txt{vertical-align:top;}
#Online .Entry .icon{ margin-bottom:5px;}
#Online .Entry .icon li{display:inline-block; font-size:12px; background-color:#F0E6C1; padding:0 8px;float: right; margin: 0 5px 0 0;}
#Online .Entry .txt h3{ font-size:18px; padding:15px; z-index: 9999;}
#Online .Entry .txt .comment{ padding-bottom:10px;padding: 0 24px; text-align: left;}
#Online .Entry .txt {text-align: center;}
#Online .Entry .txt .data .day{ font-size:12px;text-align: center;}
#Online .Entry .txt .data .day_ex{ font-size:12px;}
#Online .day{margin: 15px 0 7px 0;}
#Online .comment_ss {font-size:12px;}
#Online .Entry .txt .data .price{ font-size:16px; font-weight:bold; color:#FF9900;text-align: center;}

/*----------------------------------------Online*/

/* General button style (reset) */
.btn01 {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	border: none;
	background: none;
	cursor: pointer;
	/*width:305px;*/
    width:317px;
	min-height: 95px;
	padding: 5px 0;
	display: inline-block;
	margin: 5px 55px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-decoration: underline;
}

.btn01:after {
	content: '';
	position: absolute;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/* Button 1f */
.btn-1f {
	overflow: hidden;
}

.btn-1f:after {
	width: 101%;
	height: 0;
	top: 50%;
	left: 50%;
	background: none;
	border:2px solid #DDDDDD;
	border-width:2px 0px 2px 0px;
	opacity: 0;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

.btn-1f:hover,
.btn-1f:active {
	color: #5aa7e6;
	text-decoration: none;
}

.btn-1f:hover:after {
	height: 75%;
	opacity: 1;
}

.btn-1f:active:after {
	height: 130%;
	opacity: 1;
}

#Tieup{ padding:50px 0;}
#Tieup ul{ display:table; table-layout:fixed; margin: auto;}
#Tieup li{ display:table-cell; text-align:center; transition: 0.3s;} 
#Tieup li + li{ padding-left:40px;}
#Tieup img {border: 1px solid #dddddd;}
#Tieup li:hover {opacity: 0.7;}

/*----------------------------------------Sale_off3%*/

#Campaign h6 {
	float: left;
	position: relative;
	height: 30px;
	padding: 0 2.1em;
background: -webkit-gradient(radial, 0% 46%, 0, 0% 46%, 243, color-stop(1.00, #b7ad70), color-stop(0.00, #d5cea6));
background: -webkit-radial-gradient(0% 46%, circle, #d5cea6, #b7ad70);
background: -moz-radial-gradient(0% 46%, circle, #d5cea6, #b7ad70);
background: -o-radial-gradient(0% 46%, circle, #d5cea6, #b7ad70);
background: -ms-radial-gradient(0% 46%, circle, #d5cea6, #b7ad70);
background: radial-gradient(0% 46%, circle, #d5cea6, #b7ad70);
    width:150px;
	top:-10px;
	left: -25px;
}
h6::before,
h6::after {
	content: '';
	position: absolute;
}
h6::before {
	top: 100%;
	left: 0;
	border-width: 0 7px 7px 0;
	border-style: solid;
	border-color: transparent;
	border-right-color: #B7AD70;
}
h6::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 15px 15px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}

/*----------------------------------------Sale_off5%*/

#Campaign h5 {
	float: left;
	position: relative;
	height: 30px;
	padding: 0 2.1em;
background: -webkit-gradient(radial, 0% 48%, 0, 0% 48%, 243, color-stop(1.00, #8f0202), color-stop(0.00, #d20001));
background: -webkit-radial-gradient(0% 48%, circle, #d20001, #8f0202);
background: -moz-radial-gradient(0% 48%, circle, #d20001, #8f0202);
background: -o-radial-gradient(0% 48%, circle, #d20001, #8f0202);
background: -ms-radial-gradient(0% 48%, circle, #d20001, #8f0202);
background: radial-gradient(0% 48%, circle, #d20001, #8f0202);
    width:150px;
	top:-10px;
	left: -25px;
}
h5::before,
h5::after {
	content: '';
	position: absolute;
}
h5::before {
	top: 100%;
	left: 0;
	border-width: 0 7px 7px 0;
	border-style: solid;
	border-color: transparent;
	border-right-color: #8f0202;
}
h5::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 15px 15px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}

/*----------------------------------------diners��p*/

#Campaign h7 {
	float: left;
	position: relative;
	height: 30px;
	padding: 0 2.1em;	
background: -webkit-gradient(radial, 0% 38%, 0, 0% 38%, 243, color-stop(1.00, #0059B2), color-stop(0.00, #5198df));
background: -webkit-radial-gradient(0% 38%, circle, #5198df, #0059B2);
background: -moz-radial-gradient(0% 38%, circle, #5198df, #0059B2);
background: -o-radial-gradient(0% 38%, circle, #5198df, #0059B2);
background: -ms-radial-gradient(0% 38%, circle, #5198df, #0059B2);
background: radial-gradient(0% 38%, circle, #5198df, #0059B2);
    width:145px;
	top:-10px;
	left: -25px;
}
h7::before,
h7::after {
	content: '';
	position: absolute;
}
h7::before {
	top: 100%;
	left: 0px;
	border-width: 0 7px 7px 0;
	border-style: solid;
	border-color: transparent;
	border-right-color: #2876B5;
}
h7::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 15px 15px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}

#Campaign h9 {
	float: left;
	position: relative;
	height: 30px;
	padding: 0 2.1em;	
background: -webkit-gradient(radial, 0% 38%, 0, 0% 38%, 243, color-stop(1.00, #001e50), color-stop(0.00, #013589));
background: -webkit-radial-gradient(0% 38%, circle, #013589, #001e50);
background: -moz-radial-gradient(0% 38%, circle, #013589, #001e50);
background: -o-radial-gradient(0% 38%, circle, #013589, #001e50);
background: -ms-radial-gradient(0% 38%, circle, #013589, #001e50);
background: radial-gradient(0% 38%, circle, #013589, #001e50);
    width:145px;
	top:-10px;
	left: -25px;
}
h9::before,
h9::after {
	content: '';
	position: absolute;
}
h9::before {
	top: 100%;
	left: 0px;
	border-width: 0 7px 7px 0;
	border-style: solid;
	border-color: transparent;
	border-right-color: #2876B5;
}
h9::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 15px 15px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}

#Campaign h7 img {margin-left: -15px;}

/*----------------------------------------���ʃv����*/

#Campaign h8 {
	float: left;
	position: relative;
	height: 30px;
	padding: 0 2.1em;	
background: -webkit-gradient(radial, 0% 48%, 0, 0% 48%, 243, color-stop(1.00, #d1a300), color-stop(0.00, #FEE800));
background: -webkit-radial-gradient(0% 48%, circle, #FEE800, #d1a300);
background: -moz-radial-gradient(0% 48%, circle, #FEE800, #d1a300);
background: -o-radial-gradient(0% 48%, circle, #FEE800, #d1a300);
background: -ms-radial-gradient(0% 48%, circle, #FEE800, #d1a300);
background: radial-gradient(0% 48%, circle, #FEE800, #d1a300);

    width:75px;
	top:-10px;
	left: -25px;
}
h8::before,
h8::after {
	content: '';
	position: absolute;
}
h8::before {
	top: 100%;
	left: 0px;
	border-width: 0 7px 7px 0;
	border-style: solid;
	border-color: transparent;
	border-right-color: #967315;
}
h8::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 15px 15px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}

#Campaign h8 img {margin-left: -8px;}

/*----------------------------------------Contact*/
#Contact{ text-align:center;border-bottom: 1px solid #3D3D3D; }
#Contact h3{ text-align:center; padding:30px 0 40px 0; }
#Contact .tel{ width:440px; text-align:center; float:left; }
#Contact .tel + .tel{ float:right;}
#Contact .tel dt{ padding-bottom:18px; }
#Contact .tel dd{}
#Contact .tel dd p{ padding-bottom:20px;}
#Contact .tel dd p + p{}

#Contact .atte{ border: 1px solid #CCC; padding:10px; width: 960px; margin: 20px auto 0 auto; text-align: left; }
#Contact .atte dl{}
#Contact .atte dt{ font-weight:bold;}
#Contact .atte dd{ padding-top:5px;}
#Contact .atte dd + dd{ }
#Contact .atte dd:before{content:"\f046"; font-family:FontAwesome;padding-right:5px;}

/*----------------------------------------HowTo*/
#HowTo{ }
#HowTo .Entry{}
#HowTo .Entry + .Entry:before{ content:url(../images/howto_icon_arrow.png); display:block; text-align:center; padding:30px 0;}
#HowTo .Entry dl{ overflow:hidden;}
#HowTo .Entry dt{ float:left; width:60px; padding-right:20px; padding-top:5px;}
#HowTo .Entry dd{ float:left; width:880px;}
#HowTo .Entry dd ul{}
#HowTo .Entry dd li{ font-size:22px; padding-bottom:5px;}
#HowTo .Entry dd li + li{ font-size:14px;}


/*----------------------------------------Footer*/
#Footer{ background-color:#3D3D3D; color:#FFF; text-align:center; padding:40px 0;}
#Footer p{ padding-bottom:15px;}
#Footer p.atte{ padding:0; font-size:12px;}
#Footer ul{ padding-bottom:15px;}
#Footer li{ display:inline; padding:0 5px;}
#Footer li a{ color:#FFFFFF;}
#Footer li + li:before{ content:""; padding-right:10px;}


/*----------------------------------------LowerMain*/
#LowerMain{ margin-top:40px; padding-bottom:60px;}
#LowerMain h2{ font-size:36px; font-weight:normal;}
#LowerMain a[href$=".pdf"]:after { content:url(../images/icon_pdf.png); padding-left:2px;}

#LowerMain .list{}
#LowerMain .list dl{ display:table; width:100%;}
#LowerMain .list dt{ display:table-cell; width:200px; background-color:#E6E6E6; padding:10px 15px; text-align:center; vertical-align:middle; }
#LowerMain .list dd{display:table-cell;vertical-align:middle; padding-left:10px;}
#LowerMain .list dl + dl{ margin-top:10px;}


#LowerMain .policyEnt{}
#LowerMain .policyEnt h3{ font-size:24px; font-weight:normal; padding-bottom:10px;}
#LowerMain .policyEnt p{}
#LowerMain .policyEnt p + p{ padding-top:20px;}
#LowerMain .policyEnt + .policyEnt{ margin-top:30px; border-top: 1px dotted #3D3D3D; padding-top:30px;}


/*----------------------------------------Go_back*/
.Go_back{	display: none;
	position: fixed;
	bottom: 40%;
	left: 0px;}

.Go_back a{ display:block;}
.Go_back{ width:55px; height:70px; margin: 0 40px 0 0; display:table;z-index:9999999;}
.Go_back a{ font-size:13.5px; background-color:#6796BC; display:table-cell; vertical-align:middle;width:55px; height:70px; filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; color:#fff; text-decoration:none; text-align:center; letter-spacing: 1px;line-height: 90%; }
.Go_back a:before{ content: "\f104"; font-family: FontAwesome; padding:0 0 3px 0; display:block; font-size:50px; line-height: 0.8; text-align: center; }
.Go_back a:hover{filter: alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.4;}
.blue {color:#0900DC;}


/*----------------------------------------bnr*/
.bnr {
	text-align: center;
	margin: 10px 0;
}