@charset "utf-8";
/*
* sytle.css
* description : FM802 Saturday Amusic Islands -morning edition- KEWPIE COLORFUL BOX
*
* Created  2016/10/01.
* Last Update 2016/10/01.
*/





/* INDEX */

/*[ Default ]*/


/*[ Frame ]*/


/*[ Header ]*/


/*[ Global Navi ]*/


/*[ Footer ]*/


/*[ Others ]*/
/*----[[[ Banner ]]]----*/
/*----[[[ Button Link ]]]----*/










/*
[ Default ]
*/

html {
font-size:62.5%;
}
html * {
max-height:100%; /*for Android*/
}


body {
font-family:'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
margin:0;
padding:0;
font-size:1.6rem;
color:#4d4d4d;
letter-spacing:.05em;
background:#FFF;
-webkit-text-size-adjust: none;
}


img {
max-width:100%;
height:auto;
}


a,
a:hover,
a:active,
a:visited {
color:#009245;
}


/*[ Switch ]*/
.switch {
visibility:hidden;
}


/*[ Clearfix ] */
.cf:before,
.cf:after {
content:"";
display:table;
}
.cf:after {
clear:both;
}
.cf {
zoom:1;
}


/*[ Common ]*/
.ob-none {
display:none;
}


@media only screen and (min-width:769px) {
body {
min-width:1024px;
}
.spn {
display:none;
}

}


@media only screen and (max-width:768px) {
html {
font-size:55.5%;
}
.pc {
display:none;
}
.spn {
display:block;
}

}










/*
[ Frame ]
*/

/*[[[ Wrapper ]]]*/
.wrapper {
width:auto;
height:auto;
margin:0;
padding:0;
}





/*[[[ Container ]]]*/
.container.main {
width:auto;
height:auto;
margin:0 auto;
padding:0;
}





/*[[[ Content ]]]*/
.content {
width:auto;
height:auto;
margin:0 auto;
padding:8rem 0;
}


@media only screen and (max-width:768px) and (max-device-width:1280px) {
/*[[[ Content ]]]*/
.content {
padding:5rem 0;
}


}


@media only screen and (max-width:640px) and (max-device-width:1280px) {
/*[[[ Content ]]]*/
.content {
padding:3rem 0;
}


}










/*
[ Header ]
*/

.main-header {
width:auto;
height:auto;
margin:0;
padding:0;
background:url(../images/bg_image.jpg) no-repeat top center;
}
.main-header > .container {
width:1024px;
margin:0 auto;
padding:110px 0 30px;
}

/*[ Title ]*/
.main-header .main-ttl {
margin:0 0 0 45px;
padding:0;
text-align:left;
}

/*[ Catch ]*/
.main-header .main-catch {
margin:0 auto;
padding:0;
text-align:center;
max-width: 934px;
}



@media only screen and (max-width:768px) and (max-device-width:1280px) {
.main-header {
background:url(../images/bg_image.jpg) no-repeat top center;
background-size:128.90625% auto;
}
.main-header > .container {
width:auto;
margin:0 auto;
padding:80px 0 30px;
}

/*[ Title ]*/
.main-header .main-ttl {
width:46.875%;
margin:0 0 0 4.39453%;
}

/*[ Catch ]*/
.main-header .main-catch {
	font-size:1.8rem;
	line-height:2.4rem;
	margin:0 2rem;
	text-align:left;
}
.main-header .main-catch span {
	display:block;
	font-size:1.6rem;
	font-weight:normal;
	text-align:right;
	letter-spacing:0;
}

}


@media only screen and (max-width:420px) and (max-device-width:1280px) {
.main-header > .container {
width:auto;
margin:0 auto;
padding:58px 0 24px;
}

/*[ Title ]*/
.main-header .main-ttl {
width:auto;
margin:0 12px;
}

/*[ Catch ]*/
.main-header .main-catch {
	font-size:1.6rem;
	line-height:2.2rem;
	margin:0 18px;
}
.main-header .main-catch span {
	font-size:1.4rem;
	margin-top:.7rem;
}


}










/*
[ Global Navi ]
*/
.global-nav {
width:auto;
height:auto;
margin:0;
padding:0;
background:#cfedca;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.98, #fff), color-stop(0.00, #cfedca));
background: -webkit-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -moz-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -o-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -ms-linear-gradient(top, #cfedca 0%, #fff 98%);
background: linear-gradient(to bottom, #cfedca 0%, #fff 98%);
}
.global-nav > .container {
width:1024px;
height:auto;
margin:0 auto;
padding:0;
}
.global-nav .gn-list {
margin:0;
padding:0;
list-style:none;
text-align:center;
}
.global-nav .gn-list li {
width:auto;
margin:0;
padding:0;
float:left;
}
.global-nav .gn-list li a {
display:block;
position:relative;
}
.global-nav .gn-list li a:hover {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
background:rgba(255,255,255,.60);
}



@media only screen and (max-width:768px) and (max-device-width:1280px) {
.global-nav > .container {
width:auto;
margin:0;
}

.global-nav {
	background:none;
}

.global-nav .gn-list li {
width:50%;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.98, #fff), color-stop(0.00, #cfedca));
background: -webkit-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -moz-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -o-linear-gradient(top, #cfedca 0%, #fff 98%);
background: -ms-linear-gradient(top, #cfedca 0%, #fff 98%);
background: linear-gradient(to bottom, #cfedca 0%, #fff 98%);
}

.global-nav .gn-list li img {
	display:none;
}

.global-nav .gn-list li a {
display:block;
position:relative;
font-size:1.6rem;
font-weight:900;
padding:1.8rem 0;
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;
letter-spacing:0;
}
.global-nav .gn-list li:nth-child(odd) a {
	border-right:1px solid #cfedca;
}
.global-nav .gn-list li a:before {
content: attr(data-label);
}


}



@media only screen and (max-width:640px) and (max-device-width:1280px) {
.global-nav .gn-list li a {
font-size:1.5rem;
padding:1.6rem 0;
}

	
}



@media only screen and (max-width:320px) and (max-device-width:1280px) {
.global-nav .gn-list li a {
font-size:1.4rem;
padding:1.5rem 0;
}

	
}










/*
[ Footer ]
*/

.main-footer {
width:auto;
height:auto;
margin:0;
padding:0;
}
.main-footer > .container {
width:auto;
height:auto;
margin:0;
padding:3.2rem 0;
}


/*[ Copyright ]*/
.main-footer > .container .copyright {
font-size:1.3rem;
font-family:Arial, Helvetica, sans-serif;
text-align:center;
border-top:1px solid #cfedca;
padding-top:2rem;

}
.main-footer > .container .copyright a {
text-decoration:underline;
}
.main-footer > .container .copyright a:hover {
text-decoration:none;
}


/*[[[ Page Top Btn ]]]*/
.pagetop {
width:auto;
height:auto;
margin:0;
padding:0;
position:fixed;
right:2rem;
bottom:5rem;
list-style:none;
display:none;
}
.pagetop a {
width:72px;
height:72px;
margin:0;
padding:0;
text-indent:-9999px;
background:url(../images/btn_pagetop.png) no-repeat 0 0;
background-size:72px auto;
-webkit-background-size:72px auto;
-ms-background-size:72px auto;
-o-background-size:72px auto;
display:block;
overflow:hidden;
text-decoration:none;
}
.pagetop a:hover {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}



/*[[[ SNS Buttons ]]]*/
.sns-btns {
width:auto;
height:auto;
margin:0 0 2rem;
padding:0;
text-align:center;
}
.sns-btns .social {
display:inline-block;
line-height:1;
vertical-align:top;
}

/*[ Position ]*/
.sns-btns.right {
	text-align:right;
}

/*[ Padding ]*/
/*[ Top 2 ]*/
.sns-btns.pdnt-2 {
padding-top:2rem;
margin:0;
}


@media only screen and (max-width:420px) and (max-device-width:1280px) {
/*[[[ Page Top Btn ]]]*/
.pagetop {
right:2rem;
bottom:5rem;
}
.pagetop a {
width:48px;
height:48px;
background:url(../images/btn_pagetop.png) no-repeat 0 0;
background-size:48px auto;
-webkit-background-size:48px auto;
-ms-background-size:48px auto;
-o-background-size:48px auto;
}


}










/*
[ Others ]
*/
/*----[[[ Banner ]]]----*/
.banner {
width:auto;
height:auto;
margin:0;
padding:0;
text-align:center;
list-style:none;
}





/*----[[[ Button Link ]]]----*/
.btn-box {
width:auto;
height:auto;
margin:0;
padding:0;
list-style:none;
}
.btn-box.btn-box-pos-center {
text-align:center;
}
.btn-box a {
text-decoration:none;
}
.btn-box .btn {
-moz-appearance: none;
-webkit-appearance: none;
background: white;
border: 1px solid #d3d6db;
border-radius: 0;
color: #222324;
display: inline-block;
font-size: 1.4rem;
height: 32px;
line-height: 24px;
position: relative;
vertical-align: top;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
padding: 3px 10px;
text-align: center;
/*white-space: nowrap;*/
}
.btn-box .btn:hover {
border-color: #aeb1b5;
}
.btn-box .btn:active,
.btn-box .btn:focus {
border-color: #0068B7;
outline: none;
}
.btn-box .btn strong {
color: inherit;
}

.btn-box .btn small {
display: block;
font-size: 11px;
line-height: 1;
margin-top: 5px;
}

.btn-box .btn .fa {
line-height: 24px;
margin: 0;
width: 24px;
}

.btn-box .btn:hover {
color: #222324;
}

.btn-box .btn:active {
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}

.btn-box .btn.bs-dark {
background: #222324;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-dark:hover,
.btn-box .btn.bs-dark:focus {
background: #090a0a;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-dark:active {
border-color: transparent;
}

.btn-box .btn.bs-dark.bs-outlined {
background: transparent;
border-color: #222324;
color: #222324;
}

.btn-box .btn.bs-dark.bs-outlined:hover,
.btn-box .btn.bs-dark.bs-outlined:focus {
border-color: #090a0a;
color: #090a0a;
}

.btn-box .btn.bs-dark.bs-inverted {
background: white;
color: #222324;
}

.btn-box .btn.bs-dark.bs-inverted:hover {
background: #f2f2f2;
}

.btn-box .btn.bs-dark.bs-inverted.bs-outlined {
background-color: transparent;
border-color: white;
color: white;
}

.btn-box .btn.bs-dark.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-dark.bs-loading:after {
border-color: transparent transparent white white !important;
}

.btn-box .btn.bs-primary {
background:#009245;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-primary:hover,
.btn-box .btn.bs-primary:focus {
background:#009245;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-primary:active {
border-color: transparent;
}

.btn-box .btn.bs-primary.bs-outlined {
background: transparent;
border-color: #0068B7;
color: #0068B7;
}

.btn-box .btn.bs-primary.bs-outlined:hover,
.btn-box .btn.bs-primary.bs-outlined:focus {
border-color: #004E89;
color: #004E89;
}

.btn-box .btn.bs-primary.bs-inverted {
background: white;
color: #0068B7;
}

.btn-box .btn.bs-primary.bs-inverted:hover {
background: #f2f2f2;
}

.btn-box .btn.bs-primary.bs-inverted.bs-outlined {
background-color: transparent;
border-color: white;
color: white;
}

.btn-box .btn.bs-primary.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-primary.bs-loading:after {
border-color: transparent transparent white white !important;
}

.btn-box .btn.bs-info {
background: #002063;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-info:hover,
.btn-box .btn.bs-info:focus {
background: #6679A1;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-info:active {
border-color: transparent;
}

.btn-box .btn.bs-info.bs-outlined {
background: transparent;
border-color: #42afe3;
color: #42afe3;
}

.btn-box .btn.bs-info.bs-outlined:hover,
.btn-box .btn.bs-info.bs-outlined:focus {
border-color: #1f99d3;
color: #1f99d3;
}

.btn-box .btn.bs-info.bs-inverted {
background: white;
color: #42afe3;
}

.btn-box .btn.bs-info.bs-inverted:hover {
background: #f2f2f2;
}

.btn-box .btn.bs-info.bs-inverted.bs-outlined {
background-color: transparent;
border-color: white;
color: white;
}

.btn-box .btn.bs-info.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-info.bs-loading:after {
border-color: transparent transparent white white !important;
}

.btn-box .btn.bs-success {
background: #97cd76;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-success:hover,
.btn-box .btn.bs-success:focus {
background: #7bbf51;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-success:active {
border-color: transparent;
}

.btn-box .btn.bs-success.bs-outlined {
background: transparent;
border-color: #97cd76;
color: #97cd76;
}

.btn-box .btn.bs-success.bs-outlined:hover,
.btn-box .btn.bs-success.bs-outlined:focus {
border-color: #7bbf51;
color: #7bbf51;
}

.btn-box .btn.bs-success.bs-inverted {
background: white;
color: #97cd76;
}

.btn-box .btn.bs-success.bs-inverted:hover {
background: #f2f2f2;
}

.btn-box .btn.bs-success.bs-inverted.bs-outlined {
background-color: transparent;
border-color: white;
color: white;
}

.btn-box .btn.bs-success.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-success.bs-loading:after {
border-color: transparent transparent white white !important;
}

.btn-box .btn.bs-warning {
background: #fce473;
border-color: transparent;
color: rgba(0, 0, 0, 0.5);
}

.btn-box .btn.bs-warning:hover,
.btn-box .btn.bs-warning:focus {
background: #fbda41;
border-color: transparent;
color: rgba(0, 0, 0, 0.5);
}

.btn-box .btn.bs-warning:active {
border-color: transparent;
}

.btn-box .btn.bs-warning.bs-outlined {
background: transparent;
border-color: #fce473;
color: #fce473;
}

.btn-box .btn.bs-warning.bs-outlined:hover,
.btn-box .btn.bs-warning.bs-outlined:focus {
border-color: #fbda41;
color: #fbda41;
}

.btn-box .btn.bs-warning.bs-inverted {
background: rgba(0, 0, 0, 0.5);
color: #fce473;
}

.btn-box .btn.bs-warning.bs-inverted:hover {
background: rgba(0, 0, 0, 0.5);
}

.btn-box .btn.bs-warning.bs-inverted.bs-outlined {
background-color: transparent;
border-color: rgba(0, 0, 0, 0.5);
color: rgba(0, 0, 0, 0.5);
}

.btn-box .btn.bs-warning.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-warning.bs-loading:after {
border-color: transparent transparent rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.5) !important;
}

.btn-box .btn.bs-danger {
background: #ed6c63;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-danger:hover, .btn-box .btn.bs-danger:focus {
background: #e84135;
border-color: transparent;
color: white;
}

.btn-box .btn.bs-danger:active {
border-color: transparent;
}

.btn-box .btn.bs-danger.bs-outlined {
background: transparent;
border-color: #ed6c63;
color: #ed6c63;
}

.btn-box .btn.bs-danger.bs-outlined:hover,
.btn-box .btn.bs-danger.bs-outlined:focus {
border-color: #e84135;
color: #e84135;
}

.btn-box .btn.bs-danger.bs-inverted {
background: white;
color: #ed6c63;
}

.btn-box .btn.bs-danger.bs-inverted:hover {
background: #f2f2f2;
}

.btn-box .btn.bs-danger.bs-inverted.bs-outlined {
background-color: transparent;
border-color: white;
color: white;
}

.btn-box .btn.bs-danger.bs-inverted.bs-outlined:hover {
background: rgba(0, 0, 0, 0.05);
}

.btn-box .btn.bs-danger.bs-loading:after {
border-color: transparent transparent white white !important;
}

.btn-box .btn.bs-small {
border-radius: 0;
font-size: 1.4rem;
line-height:2.0rem;
height: 28px;
padding: .5rem .6rem;
}

.btn-box .btn.bs-medium {
border-radius: 0;
font-size: 1.8rem;
line-height:2.8rem;
height: 44px;
padding: 1rem 1.5rem;
}

.btn-box .btn.bs-large {
border-radius: 0;
font-size: 2.2rem;
line-height:3.2rem;
height: 52px;
padding: 1.4rem 2rem;
}

.btn-box .btn.bs-fullwidth {
display: block;
width: 100%;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;

}

.btn-box .btn.bs-flexible {
height: auto;
}

.btn-box .btn.bs-loading {
color: transparent;
pointer-events: none;
}

.btn-box .btn.bs-loading:after {
left: 50%;
margin-left: -8px;
margin-top: -8px;
position: absolute;
top: 50%;
position: absolute !important;
}

.btn-box .btn.bs-disabled, .btn-box .btn[disabled] {
opacity: 0.5;
pointer-events: none;
}


@media only screen and (max-width:768px) and (max-device-width:1280px) {
.btn-box .btn.bs-small {
font-size: 1.2rem;
line-height:1.8rem;
padding: .4rem .5rem;
}

.btn-box .btn.bs-medium {
font-size: 1.6rem;
line-height:2.4rem;
padding: .8rem 1rem;
}

.btn-box .btn.bs-large {
font-size: 2rem;
line-height:2.8rem;
padding: 1.2rem 1.4rem;
}


}