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

/* 
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;
	box-sizing:border-box; /* 追加要素 */
}
body { line-height:1;}
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;}
textarea { font-weight:normal; font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
/* //End// html5doctor.com Reset Stylesheet */

html { height:/*100%*/ auto; font-size:62.5%; font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background:#FFFFFF;}
body { position:static; height:/*100%*/ auto; width:100%; margin:0 auto; font-size:14px; font-size:1.4rem; line-height:1.5; color:#333333; background-color:#FFFFFF; overflow-wrap:break-word; word-wrap:break-word; word-break:break-all; background-color:transparent;}
a { text-decoration:none;}
a:hover { text-decoration:none;}
@media all and (max-width:719px)
{
html,body { -webkit-text-size-adjust:none;}
a { text-decoration:none;}
a:hover { text-decoration:none;}
}

/*文字リンク色と装飾設定*/
a:link { color:#0066FF; text-decoration:none;} 
a:visited { color:#0099FF; text-decoration:none;}
a:hover { color:#0099FF; text-decoration:none;} 
a:active { color:#0066FF; text-decoration:none;} 

/*文字サイズ*/
.text5 { font-size: 5px; font-size:0.5rem !important;}
.text8 { font-size: 8px; font-size:0.8rem !important;}
.text10 { font-size: 10px; font-size:1.0rem !important;}
.text11 { font-size: 11px; font-size:1.1rem !important;}
.text12 { font-size: 12px; font-size:1.2rem !important;}
.text13 { font-size: 13px; font-size:1.3rem !important;}
.text14 { font-size: 14px; font-size:1.4rem !important;}
.text15 { font-size: 15px; font-size:1.5rem !important;}
.text16 { font-size: 16px; font-size:1.6rem !important;}
.text17 { font-size: 17px; font-size:1.7rem !important;}
.text18 { font-size: 18px; font-size:1.8rem !important;}
.text20 { font-size: 20px; font-size:2.0rem !important;}
.text22 { font-size: 22px; font-size:2.2rem !important;}
.text24 { font-size: 24px; font-size:2.4rem !important;}
.text28 { font-size: 28px; font-size:2.8rem !important;}
.text32 { font-size: 32px; font-size:3.2rem !important;}
.text36 { font-size: 36px; font-size:3.6rem !important;}
.text48 { font-size: 48px; font-size:4.8rem !important;}
.text-wh { color:#FFFFFF !important;}
.text-red_bd { color:#FF0000 !important; font-weight:bold !important;}
.text-red { color:#FF0000 !important;}

.clear { clear:both; height:0px; margin:0; padding:0;}

.clearfix:after { /*floatの解除、ここがポイント*/ 
    display:block; 
    clear:both; 
    height:0px; 
    visibility:hidden; 
    content:"."; 
} 
.clearfix { 
    min-height: 1px; /*IE6、7対策*/ 
} 
* html .clearfix { 
    height: 1px; 
    /*\*//*/ /*MAC IE5.x対策*/ 
    height: auto; 
    overflow: hidden; 
    /**/ 
}

.fontmin { font-weight:800 !important; font-family:ＭＳ Ｐ明朝, 細明朝体, 'Hiragino Mincho ProN', 'Sawarabi Mincho', serif !important; transform: rotate(.03deg) !important;}
.fonteuromin { font-weight:normal !important; font-family:"Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}

@keyframes fadeIn {
0% { opacity: 0}
100% { opacity: 1}
}
@-webkit-keyframes fadeIn {
0% { opacity: 0}
100% { opacity: 1}
}

@keyframes fadeOut {
0% { opacity: 1}
100% { opacity: 0}
}
@-webkit-keyframes fadeOut {
0% { opacity: 1}
100% { opacity: 0}
}

/*===========================================================*/

body { margin-top:-50vh; padding-top:50vh;}

/*----- ヘッダー -----*/
header { position:fixed; top:0; right:0; left:0; z-index:2; height:70px; padding:0 20px; border-top:#0E4431 1px solid; text-align:center; background:rgba(255,255,255,1.0); transition:0.5s ease;}
header.is-fixed { background:rgba(255,255,255,1.0); transition:0.5s ease;}
header #header { box-sizing:border-box; position:relative; width:auto; max-width:1024px; margin:0 auto; padding:0; text-align:left;}
header #header #mainlogo { box-sizing:border-box; position:relative; display:inline-block; width:244px; margin:0 auto; transition:0.5s ease;}
header.is-fixed #header #mainlogo { width:244px;}
header #header #mainlogo img { width:100%; height:auto;}
header #header #mainlogo img:hover { opacity:0.7;}
/*header #header #corpinfo { position:absolute; top:0; right:0; width:auto; text-align:right;}
header #header #corpinfo p { color:#7C4197; font-size:22px; font-weight:bold;}
header #header #corpinfo p img { vertical-align:top; width:30px; height:auto; margin:0 5px 0 0;}
header #header #corpinfo p a { color:#7C4197;}*/
header #header #btn-mail { position:absolute; top:20px; right:0; width:140px; height:auto; margin:0; padding:0; text-align:right; z-index:1; transition:0.5s ease;}
header.is-fixed #header #btn-mail { top:20px; width:140px; transition:0.5s ease;}
header #header #btn-mail img { display:block; width:100%; height:auto;}
header #header #btn-mail img:hover { opacity:0.7;}
@media all and (max-width:719px)
{
header { height:52px; background:rgba(255,255,255,1.0); transition:0.0s ease;}
header #header { text-align:left; margin:0 auto; transition:0.0s ease;}
header #header #mainlogo { left:0; width:180px; padding:0; transition:0.0s ease;}
header.is-fixed #header #mainlogo { width:180px; padding:0; transition:0.0s ease;}
/*header #header #corpinfo { display:none;}*/
header #header #btn-mail { top:13px; right:0; width:120px; transition:0.0s ease;}
header.is-fixed #header #btn-mail { top:13px; width:120px; transition:0.0s ease;}
}

/*----- 開閉用ボタン -----*/
.menu-btn { display:none; position:relative; pointer-events:none;}
@media all and (max-width:719px)
{
.menu-btn { display:none; position:absolute; top:0; left:0; width:100%; height:100%; height:100vh;}
.open .menu-btn { -webkit-transition:all .5s; transition:all .5s; background:rgba(255,255,255,0.0); pointer-events:auto;}
#menuButton { display:block; position:absolute; top:13px; left:5px; width:30px; height:30px; cursor:pointer; z-index:999; pointer-events:auto; background-color:#7C4197;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#menuButton span,
#menuButton::before,
#menuButton::after { display:block; position:absolute; top:0; bottom:0; left:0; right:0; width:22px; height:1px; margin:auto; background:#FFFFFF;}
#menuButton span { overflow:hidden; z-index:1; color:#FFFFFF;}
#menuButton::before { z-index:2; transform:translate(0, -7px); content:"";}
#menuButton::after { z-index:2; transform:translate(0, 7px); content:"";}
#menuButton span { transition:transform 150ms 50ms;}
#menuButton::before,
#menuButton::after { transition:transform 200ms;}
#menuButton.active span { position:fixed; top:0; right:0; bottom:0; left:0; width:100vw; height:100%; height:100vh; /*//--transform:translate(100px, 0);--//*/ background:none; -webkit-transition:transform 150ms; transition:transform 150ms; z-index:-1;}
#menuButton.active::before { transform:rotate(45deg); background:#FFFFFF;}
#menuButton.active::after { transform:rotate(-45deg); background:#FFFFFF;}
}

/*----- メニューのスタイル -----*/
.menubox { display:none;}
.menubox > ul { position:relative; width:100%; /*max-width:1100px;*/ height:auto; margin:5px auto 0; padding-bottom:10px; list-style:none; font-size:0; z-index:9999; pointer-events:auto;}
.menubox > ul > li { box-sizing:border-box; display:inline-block; vertical-align:top; width:/*18.0*/22.5%; margin:0; padding:0; border-left:#666666 1px dotted;}
.menubox > ul > li:nth-of-type(3) { width:/*28.0*/32.5%; color:#7C4197; background-color:#F2ECF4;}
.menubox > ul > li:last-of-type { border-right:#666666 1px dotted;}
.menubox > ul > li > a { display:block; padding:5px auto; font-size:18px; color:#000000; line-height:39px;}
.menubox > ul > li:nth-of-type(3) > a { color:#7C4197;}
.menubox > ul > li > a:hover,
.menubox > ul > li:nth-of-type(3) > a:hover { text-decoration:none; color:#FFFFFF; background:#7C4197;}
.menubox > ul > li.current > a,
.menubox > ul > li.current:nth-of-type(3) > a { color:#FFFFFF; background:#7C4197; pointer-events:none;}
@media all and (max-width:719px)
{
.menubox { display:none; width:100%; height:calc( 100vh - 54px ); margin-top:54px; overflow-y:visible; opacity:0;}
.open .menubox { opacity:1.0; -webkit-transition:all .5s; transition:all .5s; pointer-events:auto; z-index:9999; background:rgba(0,0,0,0.7);}
.menubox > ul { box-sizing:border-box; width:100%; height:auto; margin:54px auto 0; padding:20px; background-color:#FFFFFF;}
.menubox > ul > li { position:relative; display:block; width:100%; margin:0; border-left:none; border-top:#666666 1px dotted; text-align:center; z-index:99999;}
.menubox > ul > li:nth-of-type(3) { width:100%;}
.menubox > ul > li:last-of-type { border-right:0; border-bottom:#666666 1px dotted;}
.menubox > ul > li > a { padding:1.25rem 5px 1.0rem; font-size:1.8rem; line-height:30px;}
.menubox > ul { pointer-events:none;}
.open .menubox > ul { pointer-events:auto;}
}
/*----- メニューの動き -----*/
header .menubox { overflow:hidden;}
header .menubox > ul { margin-top:-100px; transition:0.5s ease;}
header.is-fixed .menubox > ul { margin-top:0; transition:0.5s ease;}
@media all and (max-width:719px)
{
header .menubox > ul { margin-top:0; transition:0.5s ease;}
}

/*----- フッター -----*/
footer { margin:0; padding:0; text-align:center; border-top:#0E4431 1px solid;}
footer #footer { position:relative; width:auto; max-width:1064px; margin:0 auto; padding:10px 20px 0; text-align:left;}
footer #footer #mainlogo { box-sizing:border-box; position:relative; display:inline-block; width:244px; margin:0 auto;}
footer #footer #mainlogo img { width:100%; height:auto;}
footer #footer #btn-mail { position:absolute; top:30px; right:0; width:140px; height:auto; margin:0; padding:0; text-align:right; z-index:1;}
footer #footer #btn-mail img { width:100%; height:auto;}
footer #footer #btn-mail img:hover { opacity:0.7;}



/*footer ul.footer-info { display:inline-block; margin:20px auto; padding:0 10px; border:0; list-style:none; font-size:0; text-align:center;}
footer ul.footer-info > li { display:block; vertical-align:middle; margin:20px 0; padding:0; text-align:left; font-size:14px; color:#FFFFFF;}
footer ul.footer-info > li.shopdata h2 { text-align:center; font-size:24px;}
footer ul.footer-info > li.shopdata h2 > img { vertical-align:top; width:30px; height:auto; margin:0 5px 0 0;}
footer ul.footer-info > li.shopdata h2 span { font-size:18px;}
footer ul.footer-info > li.shopdata > img { vertical-align:text-bottom; width:30px; height:auto; margin:0 5px 0 0;}
footer ul.footer-info > li.shopdata > span { color:#FFFFFF; font-size:22px; font-weight:bold;}
footer ul.footer-info > li.shopdata > span a { color:#FFFFFF;}
footer ul.footer-info > li.sitemap ul { text-align:left;}
footer ul.footer-info > li.sitemap ul p { margin:0 0 10px; padding:0 0 5px; border-bottom:#FFFFFF 1px dotted; font-weight:bold;}
footer ul.footer-info > li.sitemap ul p:before { display:inline; content:"◆";}
footer ul.footer-info > li.sitemap ul p:after { display:inline; content:"◆";}
footer ul.footer-info > li.sitemap ul li { display:inline-block; margin:0 10px 0 0;}
footer ul.footer-info > li.sitemap ul li:last-of-type { margin:0;}
footer ul.footer-info > li.sitemap ul li a { display:block; margin:0; padding:2px 5px; color:#FFFFFF;}
footer ul.footer-info > li.sitemap ul li a:before { display:inline; content:"\025b6";}
footer ul.footer-info > li.sitemap ul li a:hover { text-decoration:none; color:#7C4197; background:#FFFFFF;}
footer ul.footer-info > li.sitemap ul li.current a { color:#7C4197; background:#FFFFFF; pointer-events:none;}*/
footer #copyright { width:auto; margin:0 auto; padding:5px 0; text-align:center; color:#FFFFFF; font-size:12px; background-color:#0E4431;}
@media all and (max-width:719px)
{
footer #footer #mainlogo { width:180px;}
footer #footer #btn-mail { top:19px; width:120px;}
/*footer ul.footer-info { text-align:center;}
footer ul.footer-info > li { font-size:1.4rem;}
footer ul.footer-info > li.shopdata h2 { font-size:2.2rem;}
footer ul.footer-info > li.shopdata { text-align:center;}
footer ul.footer-info > li.sitemap ul { max-width:200px; margin:0 auto; font-size:0;}
footer ul.footer-info > li.sitemap ul p { font-size:1.4rem;}
footer ul.footer-info > li.sitemap ul li { display:block; width:auto; margin:0 0 0.75em; font-size:1.4rem;}
footer ul.footer-info > li.sitemap ul li:last-of-type { margin:0 0 0.75em;}*/
footer #copyright { font-size:1.0rem;}
}

/*----- メイン -----*/
main { margin:0; padding:0; text-align:center;}
/*h1 { margin:40px 0; text-align:center; font-size:3.2rem;}
h1.contents-title { margin:160px 0 40px; padding:0 0 10px; border-bottom:#7C4197 2px solid; font-size:3.2rem; font-weight:normal;}*/
@media all and (max-width:719px)
{
main { margin:0; padding:0; text-align:center;}
/*h1.contents-title { margin:80px 0 40px; font-size:2.4rem;}*/
}

/*----- ページトップ用 -----*/
#pagetop {
	display:block;
	position: fixed;
	/*bottom: -100px;*/
	right: 20px;
	z-index:1;
}
#pagetop a {
	display: block;
	width: 50px;
	height: 50px;
	background-image:url(../n-img/com/pagetop.png);
	background-repeat:no-repeat;
	background-size:contain;
	text-align: center;
	color:#001D81;
	font-size: 28px;
	text-decoration: none;
	line-height: 50px;
}
#pagetop a:hover {
	background-image:url(../n-img/com/pagetop_on.png);
	color:#002ECC;
}
@media all and (max-width:719px)
{
#pagetop {
	/*bottom: -50px;*/
	right: 5px;
}
#pagetop a {
	width: 40px;
	height: 40px;
	font-size: 1.8rem;
	line-height: 40px;
}
}

/*付加要素--------------------*/
.linkanchor { margin-top:-120px; padding-top:120px;}
@media all and (max-width:719px)
{
.linkanchor { margin-top:-60px; padding-top:60px;}
}
#acc-area { display:none;}

.mg_top-10 { margin-top:10px !important;}
.mg_top-15 { margin-top:15px !important;}
.mg_top-20 { margin-top:20px !important;}
.mg_top-30 { margin-top:30px !important;}
.mg_top-40 { margin-top:40px !important;}
.mg_btm-10 { margin-bottom:10px !important;}
.mg_btm-15 { margin-bottom:15px !important;}
.mg_btm-20 { margin-bottom:20px !important;}
.mg_btm-30 { margin-bottom:30px !important;}
.mg_btm-40 { margin-bottom:40px !important;}
.box-vta { vertical-align:middle !important;}
a .box-vta { display:block !important;}
a:hover .box-vta img { opacity: 0.7 !important;}
