/* Common */

/*

基調色
黒：#3A4B57;
シンボルカラー：#CFE824;
薄茶：#9D9891;
セレクト：#E1DFDD;

TRIP：#8F829D;
ART：#596D94;
LIFE：#537063;
HAND：#C0A730;

*/

.hide {
	display: none !important;
}
.error {
	text-align: center;
	color: #FFF;
	font-size: 24px;
	line-height: 300px;
}

html {
	overflow: auto;
}
body {
	position: relative;
	min-width: 1080px;
	height: 100%;
	color: #3A4B57;
	overflow-x: hidden;
}
body.fixed {
	margin-top: 40px;
}
::selection {
	background: #E1DFDD;
}
::-moz-selection {
	background: #E1DFDD;
}
.inner {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 1000px;
}
.inner.wider {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 1080px;
}
.inner.narrower {
	position: relative;
	margin: 0 auto;
	padding: 0 75px;
	width: 850px;
}
.section {
	clear: both;
	padding: 60px 0;
}
.section.colored {
	margin-bottom: 0;
	background: url(../images/common/colored_bg.png) no-repeat center top #F0F4F7;
}
.section.colored.yellow {
	margin-bottom: 0;
	background: url(../images/common/colored_bg.png) no-repeat center top #F9FBEE;
}
.section.colored.dark {
	background: #333;
}
.section.white {
	background: #FFF;
}
.section.bordered {
	padding: 0;
	background: #FFF;
}
.section.bordered .inner {
	padding: 45px 0;
	border-top:  solid 3px #CFE824;
}

.section.colored.white h3,
.section.colored.white h4,
.section.colored.white p,
.section.colored.white li {
	color: #FFF;
}
.section.summary {
	margin-top: -60px;
	padding: 60px 0;
	background: #FAFAFA;
	border-bottom: solid 1px #EEE;
}
.section.summary h4 {
	margin-bottom: 30px;
	font-size: 15px;
}
.section_head {
	position: relative;
	margin-bottom: 45px;
}
.section_head .details {
	position: absolute;
	right: 0;
	top: 0;
}
.section_neck {
	margin-bottom: 45px;
}
.quatro .block {
	width: 252px;
}
.block {
	margin-bottom: 30px;
}
h2 {
	margin-bottom: 30px;
	font-size: 18px;
}
h2.title_section {
	margin-bottom: 39px;
	font-size: 39px;
	font-style: italic;
	font-weight: 300 !important;
	letter-spacing: 0.05em;
	text-align: center;
	color: #A4ABB0;
	line-height: 1.2em;
}
h3 {
	margin-bottom: 18px;
	font-size: 15px;
}
h3.title {
	font-size: 18px;
	font-weight: bold;
}
h3.title.webfont {
	font-size: 24px;
	font-weight: 300;
}
h3.summary_section {
	margin-bottom: 60px;
	text-align: center;
	font-size: 12px;
	color: #666;
}
h4 {
	margin-bottom: 13px;
	font-weight: bold;
}
h4.title {
	font-size: 15px;
	font-weight: bold;
}
h4.heading {
	font-size: 24px;
}
p {
	margin-bottom: 18px;
	font-size: 13px;
	line-height: 1.8em;
}
a {
	color: #4E4069;
}
#waist a {
	text-decoration: none;
	border-bottom: solid 1px #E1DFDD;
		-o-transition: all 0.2s linear;
		-ms-transition: all 0.2s linear;
		-moz-transition: all 0.2s linear;
		-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
#waist a:hover {
	border-bottom: solid 1px #2E2E2E;
		-o-transition: all 0.2s linear;
		-ms-transition: all 0.2s linear;
		-moz-transition: all 0.2s linear;
		-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
ul,
ol {
	margin-bottom: 18px;
}
li {
	margin-bottom: 6px;
}
.leftest {
	float: left;
}
.lefter {
	float: left;
}
.center {
	float: left;
}
.righter {
	float: right;
}
.rightest {
	float: right;
}
.clear {
	clear: both;
}
.quatro .leftest,
.quatro .lefter,
.quatro .righter {
	float: left;
	margin-right: 24px;
}
.quatro .rightest {
	float: right;
}
.quatro .leftest {
	clear: both;
}

.square {
	font-size: 0.6em !important;
	line-height: 0.6em !important;
	vertical-align: super !important;
}

.half {
	width: 46%;
}
.box {
	position: relative;
	border: solid 3px #000;
	margin-bottom: 30px;
	padding: 42px;
}
.box.half {
	width: 390px;
}
.box h3.title {
	position: absolute;
	display: inline-block;
	top: -0.5em;
	left: 33px;
	padding: 0 12px;
	line-height: 1em;
	background: #FFF;
}
.note {
	clear: both;
	padding-top: 30px;
	font-size: 12px;
	color: #AAA;
	line-height: 1.6em !important;
}
.featuring {
	margin: 0 3px;
	font-weight: bold;
}
.ref {
	clear: both;
	padding-top: 45px;
	font-size: 12px;
	text-align: right;
	color: #888;
	line-height: 1.6em !important;
}
.hidden {
	display: none;
}
.link {
	clear: both;
	margin: 45px auto 0 auto;
	text-align: center;
}
.link.half {
	width: 50%;
}
.link.half.lefter {
	margin: 0;
	width: 48%;
}
.link.half.righter {
	clear: none;
	margin: 0;
	width: 48%;
}
.link a {
	display: inline-block;
	padding: 6px 50px;
	background: #FFF;
	font-size: 11px;
	color: #FFF;
	text-align: center;
	background: #2E2E2E;
		-o-border-radius: 50px;
		-ms-border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
	border-radius: 50px;
	border: solid 3px #2E2E2E !important;
		-o-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}
.link.fullwidth a,
.link.half a {
	display: block;
	padding: 6px 0;
}
.link a:hover {
	color: #2E2E2E;
	background: #FFF;
	text-decoration: none;
	border: solid 3px #9D9891 !important;
}
.link.liter a {
	background: #2E2E2E; !important;
	color: #FFF !important;
	border: solid 2px #FFF;
	text-align: center;
	background: #FFF;
}
.link.liter a:hover {
	color: #2E2E2E; !important;
	background: #FFF !important;
	text-decoration: none;
}

.em {
	margin: 0 3px;
	padding-bottom: 3px;
	font-weight: bold;
	border-bottom: solid 2px #888;
}
.em.colored {
	border-bottom: solid 2px #CFE824;
}
.details {
}
.details a {
	display: block;
	padding-left: 36px;
	line-height: 33px;
	background: url(../images/common/details_bg.png) no-repeat 0 0;
	background-size: 30px;
	text-decoration: none;
		-o-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}
.details a:hover {
	background-position: 6px 0;
}
.list .list_title {
	margin-bottom: 3px;
	font-size: 15px;
}
.list .list_date {
	margin-bottom: 24px;
	font-size: 11px;
	color: #9D9891;
}
.list .list_info {
		min-height: 45px;
		height: auto !important;
	height: 45px;
}
.list .list_info.list_author .list_icon {
	float: left;
	margin-right: 12px;
	width: 45px;
	height: 45px;
}

.list h4.list_title {
	margin-bottom: 3px;
	font-size: 15px;
	font-weight: normal;
}
.list .list_info.list_author  h4.list_title,
.list .list_info.list_author  .list_date {
	padding-left: 60px;
}

.serialize .label,
.label.serialize {
	display: block;
	font-size: 11px;
}

.photo {
	border: solid 4px #FFF;
}
.above {
	clear: both;
	margin-top: 36px;
}
.webfont {
	font-weight: 400 !important;
}
.webfont.serif {
	font-family: 'Amiri', serif !important;
}
.webfont.sans {
	font-family: 'Century Gothic','Montserrat','Muli',sans-serif !important;
}
.webfont.lato {
	font-family: 'Lato', sans-serif !important;
}
.webfont.nunito {
	font-family: 'Nunito', sans-serif !important;
}
.webfont.condensed {
	font-family: 'Roboto Condensed', sans-serif;
}

.webfont.boldest {
	font-weight: 900 !important;
}
.webfont.bolder {
	font-weight: 700 !important;
}
.webfont.liter {
	font-weight: 300 !important;
}
.webfont.litest {
	font-weight: 100 !important;
}

.webfont.italic {
	font-style: italic;
}
.fb-like {
	position: absolute;
	right: 0;
	top: 15px;
}


/*** Issue Num ***/

.issue_num {
	display: block;
	float: left;
	margin-right: 9px;
	width: 20px;
	height: 20px;
	background: #333;
	text-align: center;
	font-family: 'Century Gothic','Montserrat','Muli',sans-serif !important;
	line-height: 20px;
	color: #FFF;
}

#home_author_trip .issue_num,
.category_trip .issue_num {
	background: #8F829D;
}
#home_author_art .issue_num,
.category_art .issue_num {
	background: #596D94;
}
#home_author_life .issue_num,
.category_life .issue_num {
	background: #537063;
}
#home_author_hand .issue_num,
.category_hand .issue_num {
	background: #C0A730;
}


/*** Issue Comment ***/

.issue_comment {
	display: block;
	float: left;
	margin-right: 6px;
}



/** header **/

#header {
	background: #FFF;
	background: rgba(255,255,255,0.9);
}
#header a {
	color: #4E4069;
}
#header a:hover {
	text-decoration: none;
}
#header .inner {
	padding: 24px 0;
	height: 56px;
}
#header h1 {
	position: absolute;
	top: 24px;
	left: 0;
	width: 190px;
	height: 18px;
	overflow: hidden;
}
#header h1 a {
	display: block;
	width: 190px;
	height: 18px;
	background: url(../images/common/www.kamakulani.com@2x.png) no-repeat;
	background-size: 190px 18px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#header h2#philosophy {
	position: absolute;
	top: 24px;
	left: 210px;
	width: 333px;
	height: 18px;
	font-size: 13px;
	font-family: "ヒラギノ明朝 Pro W6","Hiragino Mincho Pro","小塚明朝R","小塚明朝 std R","Kozuka Mincho std","HGS明朝E","ＭＳ Ｐ明朝",serif;
	background: url(../images/common/philosophy@2x.png) no-repeat;
	background-size: 333px 18px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#header p {
	margin-bottom: 0;
}
#header #menu_global {
	position: absolute;
	top: 0;
	right: 0;
}
#header #menu_global li {
	float: left;
	margin-left: 18px;
	line-height: 18px;
}
#header #menu_all {
}
#header #menu_all #menu_all_text a {
	display: block;
	padding: 24px 9px 24px 33px;
	font-size: 12px;
	line-height: 18px;
	background: url(../images/common/menu_all_icon.png) no-repeat 9px 24px;
}

#header .expanded #menu_all {
	background-color: #CFE824;
	background-color: rgba(207,232,36,1);
		-o-animation: menu_expanded 300ms;
		-ms-animation: menu_expanded 300ms;
		-moz-animation: menu_expanded 300ms;
		-webkit-animation: menu_expanded 300ms;
	animation: menu_expanded 300ms;
}
#header .collapse #menu_all {
	background-color: #FFF;
	background-color: rgba(255,255,255,1);
		-o-animation: menu_collapse 300ms;
		-ms-animation: menu_collapse 300ms;
		-moz-animation: menu_collapse 300ms;
		-webkit-animation: menu_collapse 300ms;
	animation: menu_collapse 300ms;
}

#header #menu_expand {
	position: absolute;
	top: 66px;
	right: 0;
	width: 200px;
	padding: 24px 24px 21px 24px;
	z-index: 9;
}
#header #menu_expand.hidden {
	display: none;
}

#header .expanded #menu_expand {
	display: block;
	background-color: #CFE824;
		-o-animation: menu_expanded 300ms;
		-ms-animation: menu_expanded 300ms;
		-moz-animation: menu_expanded 300ms;
		-webkit-animation: menu_expanded 300ms;
	animation: menu_expanded 300ms;
}

#header #menu_expand ul {
	margin-bottom: 0;
}
#header #menu_expand li {
	float: none;
	margin-left: 0;
	line-height: 1.8em;
}
#header #menu_expand a {
	color: #3A4B57;
}


@-o-keyframes menu_expanded {
	0% {
		background-color: #FFF;
	}
	100% {
		background-color: #CFE824;
	}
}
@-ms-keyframes menu_expanded {
	0% {
		background-color: #FFF;
	}
	100% {
		background-color: #CFE824;
	}
}
@-moz-keyframes menu_expanded {
	0% {
		background-color: #FFF;
	}
	100% {
		background-color: #CFE824;
	}
}
@-webkit-keyframes menu_expanded {
	0% {
		background-color: #FFF;
	}
	100% {
		background-color: #CFE824;
	}
}
@keyframes menu_expanded {
	0% {
		background-color: #FFF;
	}
	100% {
		background-color: #CFE824;
	}
}

@-o-keyframes menu_collapse {
	0% {
		background-color: #CFE824;
	}
	100% {
		background-color: #FFF;
	}
}
@-ms-keyframes menu_collapse {
	0% {
		background-color: #CFE824;
	}
	100% {
		background-color: #FFF;
	}
}
@-moz-keyframes menu_collapse {
	0% {
		background-color: #CFE824;
	}
	100% {
		background-color: #FFF;
	}
}
@-webkit-keyframes menu_collapse {
	0% {
		background-color: #CFE824;
	}
	100% {
		background-color: #FFF;
	}
}
@keyframes menu_collapse {
	0% {
		background-color: #CFE824;
	}
	100% {
		background-color: #FFF;
	}
}


#header #menu_categories {
	position: absolute;
	top: 66px;
	clear: both;
	border-right: solid 1px #CFE824;
}
#header #menu_categories li {
	float: left;
	margin-bottom: 0;
	width: 235px;
	width: 268px;
	text-align: center;
	font-size: 16px;
	line-height: 1.1em;
}
#header #menu_categories li .label {
	font-size: 11px;
}
#header #menu_categories li a {
	display: block;
	padding: 9px 0;
	width: 100%;
	background: #FFF;
	background: rgba(255,255,255,0.8);
}

#header #menu_categories li#menu_home {
	display: none;
}
#header #menu_categories li#menu_categories_trip {
	border-left: solid 1px #8F829D;
	border-left: solid 1px #CFE824;
}
#header #menu_categories li#menu_categories_art {
	border-left: solid 1px #596D94;
	border-left: solid 1px #CFE824;
}
#header #menu_categories li#menu_categories_life {
	border-left: solid 1px #537063;
	border-left: solid 1px #CFE824;
}
#header #menu_categories li#menu_categories_hand {
	border-left: solid 1px #C0A730;
	border-left: solid 1px #CFE824;
}
#header #menu_categories li#menu_categories_shop {
	display: none;
	width: 134px;
	border-left: solid 1px #CFE824;
}

#menu_toggle {
	display: none;
}
#menu_contents {
	display: none;
}

#header.fixed #menu_categories li {
	width: 225px;
	width: 258px;
}
#header.fixed #menu_categories li#menu_home {
	display: block;
	width: 40px;
}
#header.fixed #menu_categories li#menu_categories_trip {
	border-left: solid 3px #CFE824;
}
#header.fixed #menu_categories li#menu_categories_shop {
	width: 131px;
	border-left: solid 1px #CFE824;
}


#header #menu_categories li#menu_categories_trip.active a {
	color: #FFF;
	background: #8F829D;
}
#header #menu_categories li#menu_categories_art.active a {
	color: #FFF;
	background: #596D94;
}
#header #menu_categories li#menu_categories_life.active a {
	color: #FFF;
	background: #537063;
}
#header #menu_categories li#menu_categories_hand.active a {
	color: #FFF;
	background: #C0A730;
}
#header #menu_categories li#menu_categories_shop.active a {
	color: #FFF;
	background: #CFE824
}


/** Header Fixed **/

#header.fixed {
	position: fixed;
	top: 0;
	width: 100%;
		-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
		-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
		-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
		-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
		-o-animation: reveal 300ms 1 linear;
		-ms-animation: reveal 300ms 1 linear;
		-moz-animation: reveal 300ms 1 linear;
		-webkit-animation: reveal 300ms 1;
	animation: reveal 300ms 1;
	z-index: 1000;
}
#header.fixed .inner {
	padding: 0 0;
	height: 37px;
}
#header.fixed h1,
#header.fixed h2,
#header.fixed #menu {
	display: none;
}
#header.fixed #menu_categories {
	top: 0;
}

@-o-keyframes reveal {
	0% {
		top: -37px;
	}
	100% {
		top: 0;
	}
}
@-ms-keyframes reveal {
	0% {
		top: -37px;
	}
	100% {
		top: 0;
	}
}
@-moz-keyframes reveal {
	0% {
		top: -37px;
	}
	100% {
		top: 0;
	}
}
@-webkit-keyframes reveal {
	0% {
		top: -37px;
	}
	100% {
		top: 0;
	}
}
@keyframes reveal {
	0% {
		top: -37px;
	}
	100% {
		top: 0;
	}
}





/** Waist **/

/*** Issues ***/

.issue_upcoming {
	color: #AAA;
}

/** Issue Banner **/

.issue_banner {
	clear: both;
	margin: 45px auto;
	width: 998px;
	min-height: 148px;
	background: #F0F0F0;
	border: solid 1px #DDD;
}
.issue_banner p {
	margin-bottom: 0;
}
.issue_banner img {
	width: 100%;
	height: auto;
}



/** Footer **/

#footer {
}
#footer .inner {
	padding: 120px 0;
	color: #CCC;
	text-align: center;
}
#footer .section {
	margin-bottom: 0;
	padding: 0;
}
#footer a {
	color: #CCC;
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}
#back {
	display: none;
	font-size: 30px;
}
#footer #copyright {
	margin-bottom: 0;
	padding-top: 60px;
	font-size: 10px;
	letter-spacing: 0.07em;
	background: url(../images/common/footer_logo.png) no-repeat center top;
}


/*** Footer Banner ***/

#footer_banner.section {
	margin-bottom: 33px !important;
}
#footer_banner ul {
	position: relative;
	float: left;
	left: 50%;
}
#footer_banner li {
	position: relative;
	left: -50%;
	float: left;
	margin: 0 6px 12px 6px;
	width: 100px;
	height: 100px;
	overflow: hidden;
}
#footer_banner li.banner_1,
#footer_banner li.banner_10 {
	margin-left: 0;
}
#footer_banner li.banner_9,
#footer_banner li.banner_18 {
	margin-right: 0;
}
#footer_banner li.banner_empty {
	position: relative;
	color: #696663;
	text-align: left;
	background: #DBDAD9;
}
#footer_banner li.banner_empty a {
	display: block;
	width: 94px;
	height: 94px;
}
#footer_banner li.banner_empty .banner_empty_text {
	position: absolute;
	bottom: 0;
	left: 0;
	line-height: 1.2em;
	padding: 12px;
}

#footer_banner li img {
	width: 94px;
	height: 94px;
}
#footer_banner li a {
	display: block;
	border: solid 3px #FFF;
		-o-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-webkit-transition: all 200ms linear;
	transition: all 200ms linear;
}
#footer_banner li a:hover {
	border: solid 3px #696663;
}


/*** Socials ***/

.socials {
	position: relative;
	margin-bottom: 45px;
	overflow: hidden;
}
.socials ul {
	position: relative;
	float: left;
	left: 50%;
}
.socials li {
	position: relative;
	left: -50%;
	float: left;
	margin: 0 9px;
	width: 40px;
	height: 40px;
	overflow: hidden;
}
.socials li a {
	display: block;
	width: 40px;
	height: 40px;
	background: url(../images/common/social_icons.png) no-repeat;
	overflow: hidden;
		-o-transition: all 300ms linear;
		-ms-transition: all 300ms linear;
		-moz-transition: all 300ms linear;
		-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.socials li.socials_twitter a {
	display: none;
	background-position: 0 0;
}
.socials li.socials_facebook a {
	background-position: -40px 0;
}
.socials li.socials_pinterest a {
	display: none;
	background-position: -80px 0;
}
.socials li.socials_youtube a {
	display: none;
	background-position: -120px 0;
}
.socials li.socials_instagram a {
	background-position: -160px 0;
}
.socials li.socials_amazon a {
	display: none;
	background-position: -200px 0;
}
.socials li a:hover {
}


#social_share {
	margin-bottom: 39px;
	text-align: center;
		filter: alpha(opacity=0);
		-moz-opacity: 0;
	opacity: 0;
}
#issue_head_title #social_share {
	margin: 9px 0 0 0 !important;
	text-align: left!important;
}

.social_share_label {
	margin: 0 12px 0 0;
	font-size: 12px !important;
	color: #888;
}
.social-likes {
	clear: both;
	margin: 0 !important;
	padding: 0 !important;
}
.fb-like {
	top: 0;
	min-width: 90px;
		width: auto !important;
		width: 90px;
}
.fb_iframe_widget > span {
  vertical-align: baseline !important;
}