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

/* base */
body { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;position:relative;}
.base-w {width:96%;margin:0 auto;padding:0 2%;max-width:760px;}
.img-w {width:100%; height:auto;}
.img-r { float:right; margin-left:20px; margin-bottom:10px;}
.img-2row { width:96%;margin:0 auto 20px auto;}
.finish-2row {margin-bottom:180px;}
.img-2row li ,.finish-2row li { width:47%;}
.img-2row li img ,.finish-2row li img { width:100%; height:auto;}
.img-2row li:first-child ,.finish-2row li:first-child { float:left;}
.img-2row li:last-child ,.finish-2row li:last-child { float:right;}
footer {position:fixed;width: 100%; max-height:50px; background-color:#aba3cf;bottom:0;}
footer nav { display:block;width:100%;max-width:1197px;margin:0 auto;}
footer nav ul li { float:left; width:11.111111%}
footer nav ul li img { width:100%; height:auto;}
.smf-navi { display:none;}

/* top */
body#top-ct { background-image:url(../images/rt_bg.png), url(../images/lb_bg.png),url(../images/main_bg.jpg); background-position:top right, bottom left,center center;background-attachment: fixed;background-repeat:no-repeat,no-repeat,no-repeat; background-size:30% auto, 30% auto,cover;}
header#top-h {margin-top:60px;}
header#top-h h2 {float:left;}
header#top-h h2 img { width:100%; max-width:360px; height:auto;}				
header#top-h p a {float:right;display:inline-block;background-color:#eeedf5;color:#584c9d; background-image:url(../images/point_arrow.png); background-repeat:no-repeat; background-position:10px center;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 15px 5px 30px; margin-top:20px;}
header#top-h p a:hover {background-color:#584c9d;background-image:url(../images/point_arrow2.png);color:#FFF; text-decoration:none;}
h1.top-h1 { text-align:center; margin-top:80px; margin-bottom:150px;}
h1.top-h1 img { width:100%; height:auto; max-width:560px;}
.point-icon { text-align:center; margin:20px 0 0 0;}

/* sub */
body#sub-ct {background-image:url(../images/main_bg.jpg); background-position:center center;background-attachment: fixed;background-repeat:no-repeat; background-size:cover; position:relative;}
header#sub-h {background-color: rgba(255,255,255,0.5); padding:15px 0;}
header#sub-h h1 {float:left;}
header#sub-h h1 img { width:100%; max-width:360px; height:auto;}				
header#sub-h p a {float:right;display:inline-block;background-color:#eeedf5;color:#584c9d; background-image:url(../images/point_arrow.png); background-repeat:no-repeat; background-position:10px center;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 15px 5px 30px; margin-top:20px;}
header#sub-h p a:hover {background-color:#584c9d;background-image:url(../images/point_arrow2.png);color:#FFF; text-decoration:none;}
section h2 { text-align:center;}
section h2 img { width:90%; height:auto; margin:0 0 20px 0;}
section h2 .p-1 { max-width:580px;}
section h2 .p-2 { max-width:650px;}
section h2 .p-3 { max-width:730px;}
section h2 .p-4 { max-width:690px;}
section h2 .p-5 { max-width:536px;}
section h2 .p-6 { max-width:590px;}
section h2 .p-7 { max-width:710px;}
section h2 .p-f { max-width:710px; margin-top:60px;margin-bottom:60px;}
section h3 { font-size:22px; font-weight:bold; margin-bottom:20px;}
section h4 { font-size:22px; font-weight:bold; border-left:6px solid #584c9d; padding-left:10px; line-height:1.2em; margin-bottom:20px;}
section p {margin-bottom:20px; line-height:1.8em;}
section p strong { font-size:18px; color:#584c9d;}
.l-btn { position:fixed; left:2%; top:42%;}
.r-btn { position:fixed; right:2%; top:42%;}
section.base-w { width:100%; margin:0 auto; padding-bottom:20px;}
.f-link {text-align:center; margin-top:30px;}
.f-link a {display:inline-block; background-color:#eeedf5;color:#584c9d; background-image:url(../images/point_arrow.png); background-repeat:no-repeat; background-position:10px center;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 15px 5px 30px; margin:0 0 160px 0;}
.f-m {margin-bottom:160px;}
.f-link a:hover {background-color:#584c9d;background-image:url(../images/point_arrow2.png);color:#FFF; text-decoration:none;}
.f-logo {position:fixed; left: 50%; margin-left:-102px; bottom:50px;height: 82px;}
.f-link-l,.f-link-r { width:48%;}
.f-link-l a {display:inline-block; background-color:#eeedf5;color:#584c9d; background-image:url(../images/point_arrow.png); background-repeat:no-repeat; background-position:10px center;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 15px 5px 30px; margin:20px 0 20px 0;}
.f-link-r a {display:inline-block; background-color:#eeedf5;color:#584c9d; background-image:url(../images/point_arrow.png); background-repeat:no-repeat; background-position:10px center;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 15px 5px 30px; margin:20px 0 20px 0;}
.f-link-l a:hover {background-color:#584c9d;background-image:url(../images/point_arrow2.png);color:#FFF; text-decoration:none;}
.f-link-r a:hover {background-color:#584c9d;background-image:url(../images/point_arrow2.png);color:#FFF; text-decoration:none;}
.f-link-l a br,.f-link-r a br { display:none;}
.img-2row.f-m li { text-align:center;padding-top:20px;}

@media screen and (max-width: 1200px) {
	
/* base */
footer {background-color:inherit;}
.f-logo {bottom:5.4%;}

}
@media screen and (max-width: 1100px) {
	
/* base */
.f-logo {bottom:5.2%;}

}

@media screen and (max-width: 1000px) {
	
/* base */
.f-logo {bottom:4.5%;}

@media screen and (-webkit-min-device-pixel-ratio:0) {	
	
body#top-ct { background-image:none; background-image:url(../images/rt_bg.png),url(../images/main_bg2.jpg); background-position:top right,center center;background-attachment:inherit !important;background-repeat:no-repeat; background-size:30% auto,cover;}
body#sub-ct {background-image:url(../images/main_bg.jpg); background-position:center center;background-attachment:inherit !important;background-repeat:no-repeat; background-size:auto 100%; position:inherit !important;}
}

}

@media screen and (max-width: 860px) {
	
/* top */
h1.top-h1 img { width:70%;}
	
/* sub */
section h2 img { width:94%; height:auto; margin:0 0 20px 0;}
section.base-w { width:94%; margin:0 auto;}
.l-btn { position:fixed; left:2%; top:inherit; bottom:2%;}
.r-btn { position:fixed; right:2%; top:inherit; bottom:2%;}
.f-logo {bottom:0;}
.f-link a,.f-m {margin-bottom:80px;}
footer {display:none;}
.pc-navi { display:none;}
.smf-navi { display:inherit !important}
.f-link-l a br,.f-link-r a br { display:inherit;}

@media screen and (-webkit-min-device-pixel-ratio:0) {	
body#top-ct {background-size:30% auto,150% auto;}
body#sub-ct {background-image:url(../images/main_bg_s.jpg);}
}

}

@media screen and (min-width: 460px) and (max-width: 760px) {
	
/* base */
.img-r {float:none; width:98%;text-align:center; margin-bottom:20px;}
.img-r img { width:90%; height:auto;}

/* top */
header#top-h h2,header#sub-h h1 { width:50%;}
header#top-h p,header#sub-h p { font-size:2.2vw;}
header#top-h p a,header#sub-h p a { background-position:4% center; background-size:5% auto;border:1px solid #584c9d; border-radius:5px; font-weight:bold;padding:5px 3% 5px 4%; margin-top:2.5%;}

/* sub */
.l-btn {left:4%; bottom:2%;}
.r-btn {right:4%; bottom:2%;}

}

@media screen and (max-width: 459px) {
	
/* base */
.img-r {float:none; width:98%; margin-left:0; margin-bottom:20px; text-align:center;}
.img-r img { width:90%; height:auto;}
.img-2row {margin-bottom:0px;}
.img-2row li { float:none !important; width:96%; text-align:center; margin:0 auto 20px auto;}

/* top */
header#top-h h2,header#sub-h h1 {float:none; width:100%; text-align:center;}
header#top-h h2 img,header#sub-h h1 img {width:90%;text-align:center;}
header#top-h p,header#sub-h p {text-align:center;font-size:4.5vw;}
header#top-h p a ,header#sub-h p a {float:none;}
h1.top-h1 {margin-top:20px;}
h1.top-h1 img {width:90%;}
section h2 .p-f {margin-top:30px;margin-bottom:30px;}

/* sub */
header#sub-h p a {margin-top:0px;}
.f-link a,.f-m {margin-bottom:70px;}
.l-btn {left:4%; bottom:2%;}
.r-btn {right:4%; bottom:2%;}
.l-btn,.r-btn { width:15%;}
.l-btn img,.r-btn img { width:100%; height:auto;}
.f-link-l a br,.f-link-r a br { display:none;}

@media screen and (-webkit-min-device-pixel-ratio:0) {	
body#top-ct {background-size:30% auto,200% auto;}
}

}