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

/* init
----------------------------------------------- */

body {
	background: #eee;
	color: #666;
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

header {
	border-top: #eb6855 solid 3px;
	background: #fff;
	height: 50px;
}

footer {
	background: #fff;
	padding-top: 40px;
	padding-bottom: 20px;
	min-height: 200px;
}


section {
	margin: 60px 0 160px 0;
}

p {
	font-size: 88%;
	line-height: 1.6;
}

hr {
	margin:0;
	padding:0;
	clear:both;
	height:0;
	border:none;
}

h1,h2,h3,h4,h5 { color: #222; font-weight: bold; }

h1 { }
h2 { text-align: center; margin-bottom: 40px; }
h3 { font-size: xx-large; margin-bottom: 20px; letter-spacing: 10px; color: #666; /*background-color : black; text-shadow : rgba(255,255,255,0.4) 0 1px 2px, rgba(255,255,255,0.2) 1px 1px 2px; -webkit-background-clip : text;*/ }
h4 { }
h5 { }


a:link,a:visited {
	color: #333
}

a:hover,a:active {
	color: #9e2020
}

/* 暫定 */
h2 img { width: auto; }
img { width: 100%; }


/* Selected Text
----------------------------------------------- */

::selection {
	background:#ffc;
}

::-moz-selection {
	background:#ffc;
}

/* Common
----------------------------------------------- */

#wrapper {
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
}

#header_wrap {
	text-align: left;
	width: 1200px;
	margin: 0 auto;
}

#logo_mygc {
	background: url(logo_mygc.png) no-repeat;
	display: block;
	height: 50px;
	width: 260px;
	float: left;
}
#logo_mygc a {
	display: block;
	height: 50px;
	width: 160px;
}


#logo_mygc span {
	display: none;
}

#login-area {
	padding-right: 10px;
	height: 50px;
	line-height: 50px;
	float: right;
	width: 100px;
	display: block;
	text-align: right;
	font-size: small;
}

.gcac-link {}

#main {
	clear: both;
	margin:0 auto;
	background:url(main1.png) top center no-repeat;
	height: 500px;
}

#main h1 {
	display: none;
}

.container {
	width: 1200px;
	margin:0 auto;
	padding-bottom: 100px;
	text-align: left;
}

.grid {
	white-space:nowrap;
}

footer ul {
	font-size: x-small;
	line-height: 1.4;
}

footer ul li {
	padding-bottom: 5px;
}

footer p {
	text-align: center;
	font-size: small;
}


/* Back to top button */
#back-top {
	position: fixed;
	bottom: 1%;
	right: 1%;
	z-index: 1000;
}
#back-top span {
	width: 60px;
	height: 60px;
	display: block;
}

#back-top:hover {
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	opacity:0.5;
}

#back-top span img {
}

/* style
----------------------------------------------- */

.sec1 {  }
.sec2 {  }
.sec3 { text-align: center; }
.sec4 {  }
.sec5 {  }
.sec6 { text-align: center; }


.sec4 h2 { text-align: left; }
.sec2 h4 { text-align: center; font-size: x-large; color: #999; }

.fb_area {
	width: 320px;
	height: 29px;
	margin: 0 auto;
}
.fb_area img {
	float: left;
	width: 29px;
}
.fb_area p {
	line-height: 29px;
}



.button-area .button {
	width: 380px;
}

.button-area-main {
	text-align: center;
}

.button-area-main .button {
	width: 340px;
	margin: 0 auto;
	display: block;
}



/* class
----------------------------------------------- */

hr.spacer {
	height: 0;
	margin-bottom: 40px;
}


/* unit
----------------------------------------------- */

.unit {
	white-space:normal;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	margin-left: 35px;
	/* Clearfix */
	overflow: hidden;
	*overflow: visible;
}

.unit:first-child {
	margin-left: 0;
}
.column1,.column2,.column3,.column4 {}

.column1 { width: 270px; }
.column2 { width: 580px; }
.column3 { width: 890px; }
.column4 { width: 1200px; }

.box {
	width: 189px;
	background: #fff;
	border-bottom: #ccc solid 2px;
	border-right: #ccc solid 1px;
	border-radius: 3px;
	min-height: 400px;
	padding: 40px 40px;
	text-align: center;
}

.box img {
	margin-bottom: 20px;
}


.box p {
	text-align: left;
}


/* button
----------------------------------------------- */

.button-area {
	margin-top: 60px;
	text-align: center;
}

a.button {
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: middle;
	*vertical-align: auto;
	zoom: 1;
	*display: inline;
	height: 52px;
	line-height: 52px;
	padding: 0px 25.6px;
	font-weight: 300;
	font-size: 18px;
	text-shadow: 0 1px 1px white;
	margin: 0;
	text-decoration: none;
	text-align: center;
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #c22d18, 0px 8px 3px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #c22d18, 0px 8px 3px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #c22d18, 0px 8px 3px rgba(0, 0, 0, 0.3);
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e64831), color-stop(100%, #e4381f));
	background: -webkit-linear-gradient(top, #e64831, #e4381f);
	background: -moz-linear-gradient(top, #e64831, #e4381f);
	background: -o-linear-gradient(top, #e64831, #e4381f);
	background: linear-gradient(top, #e64831, #e4381f);
	background-color: #e54028;
	color: white;
	border: 1px solid #c22d18;
	border-radius: 3px;
	text-shadow: none;
	position: relative;
	top: 0;
}

a.button:focus {
	outline: none;
}

a.button:hover {
	-webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #b92b16, 0px 8px 3px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #b92b16, 0px 8px 3px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 7px 0px #b92b16, 0px 8px 3px rgba(0, 0, 0, 0.3);
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9604c), color-stop(100%, #e43c23));
	background: -webkit-linear-gradient(top, #e9604c, #e43c23);
	background: -moz-linear-gradient(top, #e9604c, #e43c23);
	background: -o-linear-gradient(top, #e9604c, #e43c23);
	background: linear-gradient(top, #e9604c, #e43c23);
	background-color: #eb6855;
}

a.button:active {
	-webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 2px 0px #c22d18, 0px 3px 3px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 2px 0px #c22d18, 0px 3px 3px rgba(0, 0, 0, 0.3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 1px rgba(255, 255, 255, 0.15), 0px 2px 0px #c22d18, 0px 3px 3px rgba(0, 0, 0, 0.3);
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e4381f), color-stop(100%, #e64831));
	background: -webkit-linear-gradient(top, #e4381f, #e64831);
	background: -moz-linear-gradient(top, #e4381f, #e64831);
	background: -o-linear-gradient(top, #e4381f, #e64831);
	background: linear-gradient(top, #e4381f, #e64831);
	background-color: #cd5240;
	color: #952312;
	border: 1px solid #d9331a;
	top: 5px;
}

a.button.disabled {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-appearance: none;
}


.button-area-ut {
	margin: 20px auto;
	text-align: center;
	font-size: x-small;
	line-height: 1.4;
}


/* slides
----------------------------------------------- */


#slides {
	display: none;
	margin-bottom:50px;
}

.slidesjs-navigation {
	margin-top:3px;
}

.slidesjs-previous {
	margin-right: 5px;
	float: left;
}

.slidesjs-next {
	margin-right: 5px;
	float: left;
}

.slidesjs-pagination {
	margin: 6px 0 0;
	float: right;
	list-style: none;
}

.slidesjs-pagination li {
	float: left;
	margin: 0 1px;
}

.slidesjs-pagination li a {
	display: block;
	width: 13px;
	height: 0;
	padding-top: 13px;
	background-image: url(pagination.png);
	background-position: 0 0;
	float: left;
	overflow: hidden;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
	background-position: 0 -13px
}

.slidesjs-pagination li a:hover {
	background-position: 0 -26px
}


.navbar {
	overflow: hidden
}



#slides {
	display: none
}



	/* For tablets & smart phones  */
@media  (max-width: 766px) {
	#header_wrap,.container { width: 100%; padding-bottom: 20px; }
	.unit { display: block; margin: 20px auto; }
	.unit:first-child { margin: 0 auto 20px;}
	.column1,.column2,.column3,.column4 { width: 80%; }
	h2 img { width: 90%; }
	h3 { letter-spacing: normal; font-size: large; }
	.sec4 .column2,.sec4 .column1 { width: 100%; }
	.sec2 .grid { margin: 0 40px; }
	.sec2 .box img { max-height: 240px; max-width: 240px; }
	.sec4 h2 { text-align: center; }
	.sec4 .column1:first-child { width: auto; margin: 0 40px; }
	.button-area .button { width: auto; font-size: 14px; }
	.fb_area { width: 280px; }
	.fb_area p { font-size: 12px; }
	#main { background:url(main3.png) top center no-repeat; height: 200px;}
	#logo_mygc { margin-top: 10px; width: 130px; height: 40px; background-size: 130px 25px; -webkit-background-size: 130px 25px; }
	#logo_mygc a { display: block; height: 40px; width: 100px; }
	.button-area-ut { width: 260px; }
	.sec4 .grid .column3 .grid .column3 { width: 100%; }
	.sec1 .grid .column1 { max-width: 270px; }
}

/* Forsmart phones */
@media (max-width: 640px) {
	.sec2 .box { width: auto; }
	#main { background:url(main2.png) top center no-repeat; height: 120px; -webkit-background-size:400px 120px; background-size: 400px 120px; }
}

	/* For smaller displays like laptops
@media (min-width: 481px) and (max-width: 766px) {
	#header_wrap,.container { width: 480px }
	.column1 { width: 114px; }
	.column2 { width: 236px; }
	.column3 { width: 358px; }
	.column4 { width: 480px; }
	.unit { margin-left: 8px; }
	.box { padding: 10px; width: 94px; }
	h2 img { width: 90%; }
	h3 { letter-spacing: normal; font-size: large; }
	.sec2 h4 { font-size: large; }
} */


	/* For smaller displays like laptops */
@media (min-width: 767px) and (max-width: 979px) {
	#header_wrap,.container { width: 724px }
	.column1 { width: 169px; }
	.column2 { width: 354px; }
	.column3 { width: 539px; }
	.column4 { width: 724px; }
	.unit { margin-left: 16px; }
	.box { padding: 15px; width: 139px; }
	.sec2 h4 { font-size: large; }
	#main { background:url(main2.png) top center no-repeat; height: 300px;}
}

	/* For larger displays */
@media (min-width: 980px) and (max-width: 1200px) {
	#header_wrap,.container { width: 960px; }
	.column1 { width: 219px; }
	.column2 { width: 466px; }
	.column3 { width: 713px; }
	.column4 { width: 960px; }
	.unit { margin-left: 28px; }
	.box { padding: 30px; width: 156px; }
}