/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/


/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
	position: relative;
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	word-break: break-word;
    overflow-wrap: break-word;
}
.container.full {
	padding: 0; }
.column,
.columns {
	width: 100%;
	float: left;
	box-sizing: border-box; }

/* For devices larger than 768px */
@media (min-width: 768px) {
	.container {
		width: 90%; }
	.container.full {
		width: 100%; }
	.column,
	.columns {
		margin-left: 1.6%; }
	.column:first-child,
	.columns:first-child {
		margin-left: 0; }

	.one.column,
	.one.columns										{ width: 6.86666666666667%; }
	.two.columns										{ width: 15.3333333333333%; }
	.three.columns									{ width: 23.8%;						}
	.four.columns										{ width: 32.2666666666667%; }
	.five.columns										{ width: 40.7333333333333%; }
	.six.columns										{ width: 49.2%;						}
	.seven.columns									{ width: 57.6666666666667%; }
	.eight.columns									{ width: 66.1333333333333%; }
	.nine.columns										{ width: 74.6%;					}
	.ten.columns										{ width: 83.0666666666667%; }
	.eleven.columns									{ width: 91.5333333333333%; }
	.twelve.columns									{ width: 100%; margin-left: 0; }

	.one-third.column								{ width: 32.2666666666667%; }
	.two-thirds.column							{ width: 66.1333333333333%; }

	.one-half.column								{ width: 49.2%; }

	/* Offsets */
	.offset-by-one.column,
	.offset-by-one.columns					{ margin-left: 8.46666666666667%; }
	.offset-by-two.column,
	.offset-by-two.columns					{ margin-left: 16.9333333333333%; }
	.offset-by-three.column,
	.offset-by-three.columns				{ margin-left: 25.4%;						}
	.offset-by-four.column,
	.offset-by-four.columns					{ margin-left: 33.8666666666667%; }
	.offset-by-five.column,
	.offset-by-five.columns					{ margin-left: 42.3333333333333%; }
	.offset-by-six.column,
	.offset-by-six.columns					{ margin-left: 50.8%;						}
	.offset-by-seven.column,
	.offset-by-seven.columns				{ margin-left: 59.2666666666667%; }
	.offset-by-eight.column,
	.offset-by-eight.columns				{ margin-left: 67.7333333333333%; }
	.offset-by-nine.column,
	.offset-by-nine.columns					{ margin-left: 76.2%;					}
	.offset-by-ten.column,
	.offset-by-ten.columns					{ margin-left: 84.6666666666667%; }
	.offset-by-eleven.column,
	.offset-by-eleven.columns				{ margin-left: 93.1333333333333%; }

	.offset-by-one-third.column,
	.offset-by-one-third.columns		{ margin-left: 33.8666666666667%; }
	.offset-by-two-thirds.column,
	.offset-by-two-thirds.columns		{ margin-left: 67.7333333333333%; }

	.offset-by-one-half.column,
	.offset-by-one-half.columns			{ margin-left: 50.8%; }

	body {
		background-color: rgba(0, 0, 0, 0);
	}

}

@media (max-width: 1023px) {
	.columns.break									{ width: 100%; margin-left: 0; }
}


/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
	font-size: 62.5%; }
body {
/*	font-size: 1.2em;  currently ems cause chrome bug misinterpreting rems on body element 
	line-height: 1.8rem;
	font-weight: 300;*/
    font-family: Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;    
    line-height: 1.6;
    color: #333;
    font-size: 14px;
    font-size: 1.4rem;

    }

article {
	overflow: hidden;
	}

article header {
	text-align: center;
}


img {
	display: block;
	margin: 0 auto;
	padding: 0;
}

.space {
	padding: 1.8rem;
}

.inline {
	display: inline-block;
	vertical-align: middle;
}

html* .inline{
	zoom: 1; /* for IE6-7 */
	display: inline; /* for IE6-7 */
}

.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;
    /**/
}

:focus {
	outline-style: none;
}

.guide {
	background-image: url(../img/18px-line.gif);
}



/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */


h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	margin-bottom: 1.8rem;
	font-weight: 300;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    
	}
h1 { font-size: 1.8rem; line-height: 2.7rem;	letter-spacing: -.05rem;}
h2 { font-size: 2.4rem; line-height: 3.6rem; letter-spacing: -.08rem; }
h3 { font-size: 1.8rem; line-height: 2.7rem;	letter-spacing: -.05rem;}
h4 { font-size: 1.6rem; line-height: 1.8rem;	letter-spacing: 0; }
h5 { font-size: 1.4rem; line-height: 1.8rem;	letter-spacing: 0; }
h6 { font-size: 1.2rem; line-height: 1.8rem;	letter-spacing: 0; }
table {letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 768px) {
	h1 { font-size: 4.2rem; line-height: 5.4rem;}
	h2 { font-size: 3.6rem; line-height: 5.4rem;}
	h3 { font-size: 2.4rem; line-height: 3.6rem;font-weight: bold;}
	h4 { font-size: 1.8rem; line-height: 2.7rem;}
	h5 { font-size: 1.4rem; line-height: 1.8rem;}
	h6 { font-size: 1.2rem; line-height: 1.8rem;}
}

p {
	margin-top: 0; }


/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
	color: #29793f; text-decoration: none; }
a:hover {
	color: #7eab7e; }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    background-color: #2a7a40;
    border: 0 none;
    border-radius: 0;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 1.6rem;
    padding: 5px 25px;
    text-decoration: none;
    /*text-transform: uppercase;*/
    white-space: nowrap;
    -moz-box-shadow: 0px 0px 2px rgba(000,000,000,0.3);
    -webkit-box-shadow: 0px 0px 2px rgba(000,000,000,0.3);
 
    }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
	color: #FFF;
	outline: 0;
	background-color: #7eab7e;
	background-image: linear-gradient(#89cd88 0%, #7eab7e 100%); }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
	color: #FFF;
	background-color: #7eab7e;
	background-image: linear-gradient(#89cd88 0%, #7eab7e 100%);}
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
	color: #FFF;
	background-color: #7eab7e;
	background-image: linear-gradient(#89cd88 0%, #7eab7e 100%); }


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
form {
	font-size: 1.4rem;
}
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
	vertical-align: middle;
	position: relative;
	height: 3.6rem; 
	line-height: 1.8rem;
	padding: 6px 10px;
	 /* The 6px vertically centers text on FF, ignored by Webkit */
	background-color: #fff;
	border-radius: 1px;
	box-shadow: none;
	border: 1px solid #D1D1D1;
	box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
	-webkit-appearance: none;
		 -moz-appearance: none;
					appearance: none; }
select::-ms-expand {
	display: none;
}					
textarea {
	min-height: 7.2rem;
	padding-top: 9px;
	padding-bottom: 9px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
	border: 1px solid #7eab7e;
	outline: 0; }
label {
	margin: 0 1rem 1.8rem; }
legend {
	font-weight: 600;
	margin-bottom: 1.8rem; }
fieldset {
	padding: 0;
	border-width: 0;
	margin-bottom: 1.8rem; }
input[type="checkbox"],
input[type="radio"] {
	display: inline;
	margin: 1.2rem; }
label > .label-body {
	display: inline-block;
	margin-left: .5rem;
	font-weight: normal; }

/* NOTE
The select menu to issue by using the select tag in the iOS Safari, does not work directly the CSS .
So , it will fundamentally defined to something other than a single select menu .*/


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
	list-style: circle inside; }
ol {
	list-style: decimal inside; }
ol, ul {
	padding-left: 0;
	margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
	margin: 0 0 1.8rem 0;
}
li {
/*	margin-bottom: 1.8rem; */}


/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
	padding: .2rem .5rem;
	margin: 0 .2rem;
	font-size: 90%;
	white-space: nowrap;
	background: #F1F1F1;
	border: 1px solid #E1E1E1;
	border-radius: 4px; }
pre > code {
	display: block;
	padding: 1rem 1.5rem;
	white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
	padding: 0.9rem 0.9rem 0.8rem;
	text-align: left;
	border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
	padding-left: 0; }
th:last-child,
td:last-child {
	padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
 }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
	width: 100%;
	box-sizing: border-box; }
.u-max-full-width {
	max-width: 100%;
	box-sizing: border-box; }
.u-pull-right {
	float: right; }
.u-pull-left {
	float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
	
	margin-bottom: 1.8rem;
	border-width: 0;
	border-top: 1px solid #E1E1E1;
	display: block; }


/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.rows:after,
.u-cf {
	content: "";
	display: table;
	clear: both; }


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


article {
	
}
.outer-container .container:first-child {
	margin-top: 0;
}
.outer-container {
	margin-top: 0px;
	padding: 1.8rem 0;
}
.container.space {
	padding: 1.8rem;
}
.container,
.row,
.rows {
	margin-bottom: 1.8rem;
}
.container:last-child,
.row:last-child {
	margin-bottom: 0;
}
.column, .columns {
	margin-bottom: 1.8rem;
}
.column:last-child,
.columns:last-child {
	margin-bottom: 0;
}
.column >*:last-child,
.columns >*:last-child {
	margin-bottom: 0;
}
.column.space,
.columns.space,
.column >.space,
.columns >.space {
	padding: 1.8rem;
}

/* Larger than mobile */
@media (min-width: 414px) {
	article {
		
	}
	.outer-container .container:first-child {
		margin-top: 0;
	}
	.outer-container {
		margin-top: 0px;
		padding: 3.6rem 0;
	}
	.container.space {
		padding: 3.6rem;
	}
	.container,
	.row,
	.rows {
		margin-bottom: 1.8rem;
	}
	.container:last-child,
	.row:last-child {
		margin-bottom: 0;
	}
	.column, .columns {
		margin-bottom: 1.8rem;
	}
	.column:last-child,
	.columns:last-child {
		margin-bottom: 0;
	}
	.column >*:last-child,
	.columns >*:last-child {
		margin-bottom: 0;
	}
	.column.space,
	.columns.space,
	.column >.space,
	.columns >.space {
		padding: 1.8rem;
	}
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 768px) {
	article {
		
		
	}
	section .container:first-child {
		margin-top: 0;
	}
	.outer-container {
		margin-top: 0px;
		padding: 5.4rem 0;
	}
	.container.space {
		padding: 5.4rem;
	}
	.container,
	.row,
	.rows {
		margin-bottom: 5.4rem;
		margin-bottom: 3.6rem;
	}
	.container:last-child,
	.row:last-child {
		margin-bottom: 0;
	}
	.column, .columns {
		margin-bottom: 0;
	}
	.column:last-child,
	.columns:last-child {
		margin-bottom: 0;
	}
	.column >*:last-child,
	.columns >*:last-child {
		margin-bottom: 0;
	}
	.column.space,
	.columns.space,
	.column >.space,
	.columns >.space {
		padding: 1.8rem;
	}
}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

/* ----- webfont ----- */

@font-face {
	font-family: 'icomoon2';
	src: url('../fonts/icomoon2.eot?wpozpf');
	src: url('../fonts/icomoon2.eot?wpozpf#iefix') format('embedded-opentype'),  url('../fonts/icomoon2.ttf?wpozpf') format('truetype'),  url('../fonts/icomoon2.woff?wpozpf') format('woff'),  url('../fonts/icomoon2.svg?wpozpf#icomoon2') format('svg');
	font-weight: normal;
	font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'icomoon2' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	/* Enable Ligatures ================ */
	letter-spacing: 0;
	-webkit-font-feature-settings: "liga";
	-moz-font-feature-settings: "liga=1";
	-moz-font-feature-settings: "liga";
	-ms-font-feature-settings: "liga" 1;
	-o-font-feature-settings: "liga";
	font-feature-settings: "liga";
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.icon-home:before {
	content: "\e900";
}
.icon-image:before {
	content: "\31";
}
.icon-images:before {
	content: "\32";
}
.icon-connection:before {
	content: "\33";
}
.icon-book:before {
	content: "\34";
}
.icon-price-tag:before {
	content: "\35";
}
.icon-price-tags:before {
	content: "\36";
}
.icon-coin-dollar:before {
	content: "\37";
}
.icon-coin-yen:before {
	content: "\38";
}
.icon-credit-card:before {
	content: "\39";
}
.icon-phone:before {
	content: "\71";
}
.icon-phone-hang-up:before {
	content: "\77";
}
.icon-address-book:before {
	content: "\65";
}
.icon-envelop:before {
	content: "\72";
}
.icon-pushpin:before {
	content: "\74";
}
.icon-location2:before {
	content: "\79";
}
.icon-compass:before {
	content: "\75";
}
.icon-compass2:before {
	content: "\69";
}
.icon-map:before {
	content: "\6f";
}
.icon-history:before {
	content: "\70";
}
.icon-clock:before {
	content: "\40";
}
.icon-clock2:before {
	content: "\5b";
}
.icon-alarm:before {
	content: "\61";
}
.icon-bell:before {
	content: "\73";
}
.icon-calendar:before {
	content: "\64";
}
.icon-keyboard:before {
	content: "\66";
}
.icon-mobile:before {
	content: "\67";
}
.icon-bubble:before {
	content: "\68";
}
.icon-bubbles:before {
	content: "\6b";
}
.icon-bubbles2:before {
	content: "\6c";
}
.icon-bubble2:before {
	content: "\3b";
}
.icon-bubbles3:before {
	content: "\3a";
}
.icon-bubbles4:before {
	content: "\5d";
}
.icon-user:before {
	content: "\7a";
}
.icon-users:before {
	content: "\78";
}
.icon-user-plus:before {
	content: "\63";
}
.icon-user-minus:before {
	content: "\76";
}
.icon-user-check:before {
	content: "\62";
}
.icon-user-tie:before {
	content: "\6e";
}
.icon-hour-glass:before {
	content: "\6d";
}
.icon-spinner11:before {
	content: "\2c";
}
.icon-search:before {
	content: "\2e";
}
.icon-zoom-in:before {
	content: "\2f";
}
.icon-zoom-out:before {
	content: "\5f";
}
.icon-key:before {
	content: "\2d";
}
.icon-lock:before {
	content: "\5e";
}
.icon-unlocked:before {
	content: "\a5";
}
.icon-cog:before {
	content: "\21";
}
.icon-stats-dots:before {
	content: "\23";
}
.icon-spoon-knife:before {
	content: "\24";
}
.icon-bin:before {
	content: "\25";
}
.icon-switch:before {
	content: "\26";
}
.icon-clipboard:before {
	content: "\27";
}
.icon-list-numbered:before {
	content: "\28";
}
.icon-list2:before {
	content: "\29";
}
.icon-menu:before {
	content: "\30";
}
.icon-cloud:before {
	content: "\3d";
}
.icon-cloud-download:before {
	content: "\7e";
}
.icon-cloud-upload:before {
	content: "\7c";
}
.icon-link:before {
	content: "\51";
}
.icon-flag:before {
	content: "\57";
}
.icon-attachment:before {
	content: "\45";
}
.icon-bookmark:before {
	content: "\52";
}
.icon-bookmarks:before {
	content: "\54";
}
.icon-sun:before {
	content: "\59";
}
.icon-brightness-contrast:before {
	content: "\55";
}
.icon-star-empty:before {
	content: "\49";
}
.icon-star-full:before {
	content: "\4f";
}
.icon-heart:before {
	content: "\50";
}
.icon-warning:before {
	content: "\60";
}
.icon-notification:before {
	content: "\7b";
}
.icon-question:before {
	content: "\41";
}
.icon-plus:before {
	content: "\53";
}
.icon-minus:before {
	content: "\44";
}
.icon-info:before {
	content: "\46";
}
.icon-cancel-circle:before {
	content: "\47";
}
.icon-blocked:before {
	content: "\48";
}
.icon-cross:before {
	content: "\4a";
}
.icon-checkmark:before {
	content: "\4b";
}
.icon-checkmark2:before {
	content: "\4c";
}
.icon-spell-check:before {
	content: "\2b";
}
.icon-enter:before {
	content: "\2a";
}
.icon-exit:before {
	content: "\7d";
}
.icon-circle-up:before {
	content: "\5a";
}
.icon-circle-right2:before {
	content: "\b6";
}
.icon-circle-down:before {
	content: "\58";
}
.icon-circle-left:before {
	content: "\43";
}
.icon-checkbox-checked:before {
	content: "\56";
}
.icon-checkbox-unchecked:before {
	content: "\42";
}
.icon-radio-checked:before {
	content: "\4e";
}
.icon-radio-unchecked:before {
	content: "\4d";
}
.icon-scissors:before {
	content: "\ea59";
}
.icon-table2:before {
	content: "\3e";
}
.icon-share:before {
	content: "\3f";
}
.icon-share2:before {
	content: "\a1";
}
.icon-mail:before {
	content: "\2122";
}
.icon-file-pdf:before {
	content: "\a3";
}
.icon-file-word:before {
	content: "\a2";
}
.icon-file-excel:before {
	content: "\221e";
}