/* font */
/*
 * "M PLUS Rounded 1c" is lisenced under the SIL Open Font License 1.1
 * https://fonts.google.com/
 */

@font-face {
   font-family: M PLUS Rounded 1c ttf;
   src: url('../font/M_PLUS_Rounded_1c/MPLUSRounded1c-Regular.ttf');
   font-weight: normal;
   font-display: swap;
}

@font-face {
   font-family: M PLUS Rounded 1c ttf;
   src: url('../font/M_PLUS_Rounded_1c/MPLUSRounded1c-Bold.ttf');
   font-weight: bold;
   font-display: swap;
}

/*
 * "Sawarabi Mincho" is lisenced under the SIL Open Font License 1.1
 * https://fonts.google.com/
 */

@font-face {
   font-family: Sawarabi Mincho ttf;
   src: url('../font/Sawarabi_Mincho/SawarabiMincho-Regular.ttf');
   font-weight: normal;
   font-display: swap;
}

/*
 * "LigatureSymbols" is lisenced under the SIL Open Font License 1.1
 * http://kudakurage.com/ligature_symbols/
 */

@font-face {
    font-family: 'LigatureSymbols';
    src: url('../font/LigatureSymbols/LigatureSymbols-2.11.eot');
    src: url('../font/LigatureSymbols/LigatureSymbols-2.11.eot?#iefix') format('embedded-opentype'),
         url('../font/LigatureSymbols/LigatureSymbols-2.11.woff') format('woff'),
         url('../font/LigatureSymbols/LigatureSymbols-2.11.ttf') format('truetype'),
         url('../font/LigatureSymbols/LigatureSymbols-2.11.svg#LigatureSymbols') format('svg');
    font-weight: normal;
    font-style: normal;
}

.lsf {
  font-family: 'LigatureSymbols' !important;
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
  font-size: 1.25em !important;
  font-weight: normal !important
}

.lsf.m-right{
	margin-right: 0.25em;
}

.lsf.m-left{
	margin-left: 0.25em;
}

.lsf-icon:before {
  content:attr(title);
  margin-right:0.3em;
  font-size:130%;
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
  font-weight: normal !important
}

/* common */
*{
	font-family: 'Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	font-size: 16px;
	
}

html {
	display: flex;
	flex-direction: column;
}

body{
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	position: relative;
	overflow-x: hidden;
	min-width: 320px;
	min-height: 100vh;
}

body > *{
	flex-grow: 0;
	flex-shrink: 0;
}

body main{
	flex-grow: 1;
}

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
	body main{
		flex-grow: 0;
	}
}

a[href^="tel:"] {
	cursor: default !important;
	color: inherit !important;
	font-size: inherit !important;
	text-decoration: inherit !important;
	line-height: inherit !important;
}

a[href^="tel:"]:hover img{
	opacity: 1 !important;
}

table{
	table-layout: fixed;
}

a{
	color: #286EC9;
}

a:hover{
	color: #286EC9;
	text-decoration: underline;
}


/* button */
.buttons-wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
}

.buttons-wrapper.align-left{
	justify-content: flex-start;
}

.buttons-wrapper > *{
	flex-grow: 0;
	flex-shrink: 0;
}

.buttons-wrapper > .common{
	font-size: 20px;
	font-weight: bold;
	max-width: calc(100% - 2em);
	padding: 0.25em 1em;
	margin: 0.5em 1em;
	border: 2px solid #83cfc5;
	color: #83cfc5;
	background-color: transparent;
	text-decoration: none;
	transition: color 0.25s, background-color 0.25s;
	word-break: break-all;
}

.buttons-wrapper > .common:hover{
	color: #FFF;
	background-color: #83cfc5;
}

/* header */
header .catch{
	width: 100%;
	margin: 0;
	padding: 0;
}

header .catch img{
	display: block;
	width: 100%;
}

header .catch-sub{
	position: relative;
}

header .catch-sub .bg{
	display: block;
	width: 100%;
}

header .catch-sub .icon{
	display: block;
	position: absolute;
	top: 50%;
	right: 2.5%;
	transform: translate(0,-50%);
	width: 17.5%;
	margin: 0;
}

header .catch-sub .icon img{
	width: 100%;
	
}

@media(max-width: 750px){
	header .catch-sub .icon{
		right: auto;
		top: 1.25%;
		transform: translate(0,0);
		left: 2.5%;
		width: 15%;
	}
}



/* footer */
footer > ul{
	display: flex;
	margin: 0;
	padding: 0;
	flex-wrap: nowrap;
	list-style: none;
}

footer > ul > li{
	position: relative;
	flex-grow: 0;
	flex-shrink: 0;
}

footer > ul > li.logo{
	width: 25%;
}

footer > ul > li.main{
	width: 75%;
}

footer > ul > li:before{
	content: "";
	position: absolute;
	height: 100%; 
	width: 200%;
	transform: skewX(150deg);
	box-shadow: 2px 2px 10px #666;
	z-index: 10;
}

footer > ul > li.logo:before{
	background-color: #83cfc5;
	height: calc(100% + 30px);
	bottom: 0;
	right: -50px;
	z-index: 5;
	
}

footer > ul > li.main:before{
	background-color: #85a3c9;
	bottom: 0;
	left: 0;
}

footer > ul > li.logo{
	padding-left: 5%;
	padding-right: 5%;
	padding-bottom: 50px;
	text-align: center;
}

footer > ul > li.logo img{
	width: 175px;
	max-width: 100%;
	position: relative;
	z-index: 50;
}

footer > ul > li.main{
	padding-left: 5%;
	padding-right: 5%;
}

footer > ul > li.main > *{
	position: relative;
	z-index: 50;
}

footer > ul > li.main > .nav{
	margin: 10px 0;
}

footer > ul > li.main > .nav > ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	list-style: none;
	padding: 0;
}

footer > ul > li.main > .nav > ul > li{
	flex-shrink: 0;
	flex-grow: 0;
	margin: 0.25em 0.5em;
}

footer > ul > li.main > .nav > ul > li a{
	color: #333;
}

footer > ul > li.main > .logo{
	display: none;
}

footer > ul > li.main > .info{
	text-align: center;
	color: #FFF;
	font-size: 22px;
}

footer > ul > li.main > .info .com{
	color: inherit;
	font-size: 125%;
}

footer > ul > li.main > .copy{
	text-align: center;
	color: #333;
	font-size: 18px;
	margin: 0.25em auto;
}

@media(max-width: 750px){
	footer > ul > li:before{
		display: none;
	}
	
	footer > ul > li.logo{
		display: none;
	}
	
	footer > ul > li.main{
		width: 100%;
		padding: 0;
		background-color: #85a3c9;
		box-shadow: 2px 2px 10px #666;
	}
	
	footer > ul > li.main > *{
		padding-left: 5%;
		padding-right: 5%;
	}
	footer > ul > li.main > .nav{
		background-color: #83cfc5;
		margin: 0 0 10px;
		box-shadow: 2px 2px 10px #666;
	}
	
	footer > ul > li.main > .logo{
		display: block;
		text-align: center;
		margin: 15px auto 5px;
	}
	
	footer > ul > li.main > .logo img{
		width: 75px;
		max-width: 100%;
		position: relative;
		z-index: 50;
	}
	
	footer > ul > li.main > .info{
		font-size: 16px;
	}
	
	footer > ul > li.main > .copy{
		font-size: 16px;
	}
	
}

/* nav */
nav{
	position: relative;
	padding: 0;
	background-color: #85a3c9;
	text-align: right;
	box-shadow: 2px 2px 10px #666;
	font-size: 0;
}

nav *{
	text-align: left;
}

nav .title{
	position: absolute;
	top: 10px;
	left: calc(-10% - 5px);
	width: 45%;
	padding-left: 15%;
	transform: skewX(150deg);
	background-color: #83cfc5;
	box-shadow: 2px 2px 10px #666;
	z-index: 100;
}

nav .title > a{
	text-decoration: none;
	color: #FFF;
	font-size: 24px;
	padding: 0.125em 0;
	display: block;
}

nav .title > a > span{
	display: inline-block;
	transform: skewX(-150deg);
	font-size: inherit;
	margin-right: 1em;
}

nav .footer-figure{
	position: absolute;
	top: -10px;
	right: calc(-10% - 5px);
	width: 15%;
	margin: 0;
	transform: skewX(150deg);
	background-color: #83cfc5;
	box-shadow: 2px 2px 10px #666;
	height: 100%;
	z-index: 100;
}

nav .nav-wrapper{
	width: 60%;
	margin: 0 5%;
	display: inline-block;
	z-index: 50;
}

nav .nav-wrapper > ul{
	transform: skewX(150deg);
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	flex-shrink: 0;
	flex-grow: 0;
	justify-content: space-between;
}

nav .nav-wrapper > ul > li{
	list-style: none;
	flex-grow: 1;
	flex-shrink: 1;
}
nav .nav-wrapper > ul > li:not(:last-of-type){
	border-right: 1px solid #ecb01b;
}

nav .nav-wrapper > ul > li > a{
	display: block;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	transition: 0.25s background-color;
}

nav .nav-wrapper > ul > li > a:hover{
	background-color: rgba(0,0,0,0.25);
}

nav .nav-wrapper > ul > li> a > span{
	display: block;
	transform: skewX(-150deg);
	font-size: 18px;
	padding: 0.25em 0.5em;
	text-align: center;
}

@media(max-width: 1150px){
	nav{
		padding: 10px 0 5px;
	}
	
	nav .title{
		top: auto;
		bottom: calc(100% - 5px);
		width: 65%;
	}
	
	nav .title > a{
		font-size: 28px;
	}
	
	nav .nav-wrapper{
		width: 90%;
	}
	
	nav .footer-figure{
		display: none;
	}
	
}

@media(max-width: 860px){
	nav .title{
		width: 75%;
	}
}

@media(max-width: 750px){
	nav {
		height: 8vw;
		padding: 0;
	}
	
	nav .title{
		width: 95%;
		bottom: 2vw;
	}

	nav .title > a{
		font-size: 5vw;
	}
	
	nav .nav-wrapper{
		display: none;
	}
	
}

/* nav (responsive) */

.respon-nav-button{
	display: none;
	position: fixed;
	right: -1em;
	top: 0;
	font-size: 18px;
	width: 4em;
	height: 3em;
	padding-right: 1em;
	background-color: #ecb01a;
	transform: skewX(160deg);
	box-shadow: 2px 2px 10px #666;
	z-index: 50000;
}

.respon-nav-button .icon-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	font-size: inherit;
	transform: skewX(-160deg);
}

.respon-nav-button .icon-wrapper > * {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-decoration: none;
	color: #FFF;
	font-weight: normal;
}

.featherlight-window{
	display: none;
}

@media(max-width: 750px){
	.respon-nav-button{
		display: block;
	}
}


.respon-nav-wrapper > ul{
	list-style: none;
	padding: 20px;
	margin: 0;
}

.respon-nav-wrapper > ul > li.nav{
	font-size: 18px;
}

.respon-nav-wrapper > ul > li.nav > ul{
	list-style: none;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.respon-nav-wrapper > ul > li.nav > ul > li{
	font-size: 20px;
	margin: 0.25em 0;
}

.respon-nav-wrapper > ul > li.nav > ul > li a{
	display: block;
	font-size: inherit;
}

.respon-nav-wrapper > ul > li.nav > ul > li a span{
	display: block;
	text-align: center;
	font-size: inherit;
}




/* top */
.content-wrapper.top-about{
	margin: 5vw 0 5vw;
}

.content-wrapper.top-about .content{
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	margin: 5vw 0;
}

.content-wrapper.top-about .content:nth-of-type(2n+1){
	justify-content: flex-start;
	padding-right: 5%;
}

.content-wrapper.top-about .content:nth-of-type(2n){
	justify-content: flex-end;
	flex-direction: row-reverse;
	padding-left: 5%;
}

.content-wrapper.top-about .content .img{
	width: 65%;
	padding: 15px 0;
	flex-grow: 0;
	flex-shrink: 0;
}

.content-wrapper.top-about .content .img img{
	width: 100%;
}

.content-wrapper.top-about .content .about{
	width: 35%;
}

.content-wrapper.top-about .content .about .title{
	text-align: center;
	font-size: 50px;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	font-weight: normal;
	margin-bottom: 0.5em;
}

.content-wrapper.top-about .content:nth-of-type(2n+1) .about .title{
	transform: translate(-60%,0);
}

.content-wrapper.top-about .content:nth-of-type(2n) .about .title{
	transform: translate(60%,0);
}

.content-wrapper.top-about .content .about .text{
	text-align: left;
	font-size: 24px;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

@media(max-width: 750px){
	.content-wrapper.top-about .content{
		flex-direction: column !important;
		padding: 0 !important;
	}
	
	.content-wrapper.top-about .content > *{
		width: 100% !important;
	}
	
	.content-wrapper.top-about .content .about{
		padding: 0 5% !important;
	}
	
	.content-wrapper.top-about .content .about .title{
		transform: none !important;
		font-size: 8vw;
	}
	
	.content-wrapper.top-about .content:nth-of-type(2n+1) .about .title{
		text-align: left;
	}
	
	.content-wrapper.top-about .content:nth-of-type(2n) .about .title{
		text-align: right;
	}
	
	.content-wrapper.top-about .content .about .text{
		font-size: 16px;
	}
	
}

.content-wrapper.top-pr .content{
	padding: 0 5%;
	margin: 5vw 0;
}

.content-wrapper.top-pr .content:last-of-type{
	margin-bottom: 0;
}

.content-wrapper.top-pr .content:nth-of-type(2n + 1){
	text-align: left;
}

.content-wrapper.top-pr .content:nth-of-type(2n){
	text-align: right;
}

.content-wrapper.top-pr .content .title{
	display: inline-block;
	position: relative;
	font-size: 40px;
	font-weight: normal;
	text-align: left;
	color: #FFF;
	padding: 0.125em 2em;
	margin: 1.5em 0;
	text-shadow: 2px 2px 10px #666;
	z-index: 100;
}

.content-wrapper.top-pr .content .title:before,
.content-wrapper.top-pr .content .title:after{
	content: "";
	position: absolute;
	display: block;
	width: calc(100% - 0.75em);
	height: calc(100% - 0.5em);
	transform: skewX(150deg);
	z-index: -1;
}

.content-wrapper.top-pr .content .title:before{
	left: 0;
	bottom: 0;
	background-color: #85a3c9;
	z-index: -1;
}

.content-wrapper.top-pr .content .title:after{
	right: 0;
	top: 0;
	background-color: #83cfc5;
	z-index: -2;
}

@media(max-width: 750px){
	.content-wrapper.top-pr .content .title{
		font-size: 6.5vw;
	}
}

.content-wrapper.top-pr .content .item-wrapper > ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	list-style: none;
	padding: 0;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li{
	width: calc(100% / 4 - 1%);
	max-width: 350px;
	flex-grow: 0;
	flex-shrink: 0;
	margin-bottom: 15px;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li img{
	width: 100%;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li p{
	width: 100%;
	text-align: center;
	font-size: 28px;
	padding: 0.25em 0.5em;
	margin: 0;
	color: #FFF;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

.content-wrapper.top-pr .content .item-wrapper > ul > li.daily p{
	background-color: #9cc9e0;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li.cosmetics p{
	background-color: #f2898d;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li.health p{
	background-color: #f2a64e;
}

.content-wrapper.top-pr .content .item-wrapper > ul > li.beauty p{
	background-color: #8b225b;
}

@media(max-width: 750px){
	.content-wrapper.top-pr .content .item-wrapper > ul > li{
		width: calc(100% / 2 - 1%);
	}
}

@media(max-width: 460px){
	.content-wrapper.top-pr .content .item-wrapper > ul > li p{
		font-size: 16px;
	}
}


.content-wrapper.top-pr .content .logistics-wrapper > ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	list-style: none;
	padding: 0;
}

.content-wrapper.top-pr .content .logistics-wrapper > ul > li{
	width: calc(100% / 3 - 1%);
	max-width: 450px;
	flex-grow: 0;
	flex-shrink: 0;
}

.content-wrapper.top-pr .content .logistics-wrapper > ul > li img{
	width: 100%;
}

.content-wrapper.top-pr .content .logistics-wrapper > ul > li p{
	text-align: center;
	font-size: 32px;
}

@media(max-width: 750px){
	.content-wrapper.top-pr .content .logistics-wrapper > ul > li{
		width: 100%;
		max-width: 100%;
	}
	
	.content-wrapper.top-pr .content .logistics-wrapper > ul > li p{
		text-align: center;
		font-size: 7vw;
	}

}

.content-wrapper.top-pr .content .text{
	text-align: center;
	font-size: 36px;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	margin: 1em 0;
}

@media(max-width: 750px){
	.content-wrapper.top-pr .content .text{
		font-size: 5vw;
	}
}

.bottom-img{
	width: 100%;
}

.bottom-img img{
	width: 100%;
}

/* subpage */
.content-wrapper.subpage-content > .content{
	padding: 0;
	margin: 75px auto;
	width: 90%;
	max-width: 1350px;
}

@media(max-width: 750px){
	.content-wrapper.subpage-content > .content{
		margin: 5vw auto 75px;
	}
}

.content-wrapper.subpage-content .content.content-full{
	width: 100%;
	max-width: 100%;
}

.content-wrapper.subpage-content .content.content-split-top{
	margin-bottom: 0;
}

.content-wrapper.subpage-content .content.content-split-middle{
	margin-top: 0;
	margin-bottom: 0;
}

.content-wrapper.subpage-content .content.content-split-bottom{
	margin-top: 0;
}

.content-wrapper.subpage-content .content .common-title{
	font-size: 34px;
	font-weight: normal;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	margin-bottom: 0.5em;
}

@media(max-width: 540px){
	.content-wrapper.subpage-content .content .common-title{
		font-size: 8vw;
	}
}

/* works */
.philosophy-title{
	position: relative;
	font-size: 36px;
	padding: 0 0.25em 0 1.75em;
	font-family: 'Sawarabi Mincho','Sawarabi Mincho ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	font-weight: normal;
}

.philosophy-title > span{
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	display: inline-block;
}

.philosophy-title > span:nth-of-type(2){
	transform: translate(0.25em,-0.125em);
	font-size: 1.1em;
}

.philosophy-title:before,
.philosophy-title:after{
	content: "";
	position: absolute;
	z-index: -1;
}

.philosophy-title:before{
	left: 1.5em;
	top: 50%;
	width: 100%;
	height: 3em;
	border-left: 1px solid #AAA;
}

.philosophy-title:after{
	left: 0;
	bottom: 0;
	width: 5em;
	height: 100%;
	border-bottom: 1px solid #AAA;
}

.philosophy-wrapper{
	padding-left: calc(36px * 1.5);
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	
}

.philosophy-wrapper > *{
	flex-shrink: 0;
}

.philosophy-wrapper > .text{
	font-size: 24px;
	padding: 0.5em 0.25em 0.5em 1em;
	width: calc(100% - 235px - 5px);
	line-height: 200%;
	font-family: 'Sawarabi Mincho','Sawarabi Mincho ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

.philosophy-wrapper > .img{
	width: 235px;
}

.philosophy-wrapper > .img img{
	width: 100%;
}

@media(max-width: 750px){
	.philosophy-title{
		padding-left: 0.75em;
	}
	
	.philosophy-title:before{
		left: 0.5em;
		top: 50%;
	}
	
	.philosophy-title:after{
		left: 0;
		bottom: 0;
	}
	
	.philosophy-wrapper{
		display: block;
		position: relative;
		padding-left: calc(36px * 0.5);
	}
	
	.philosophy-wrapper > .text{
		width: 100%;
		padding: 0.25em 0.5em;
		font-size: 18px;
		line-height: 175%;
	}
	
	.philosophy-wrapper > .img{
		width: 235px;
		margin: 0 auto;
	}
}

.works-title{
	position: relative;
	font-size: 36px;
	padding: 1.75em 1.75em 0 0.25em;
	font-family: 'Sawarabi Mincho','Sawarabi Mincho ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	font-weight: normal;
	text-align: right;
	margin-bottom: 1em;
}

.works-title > span{
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	display: inline-block;
}

.works-title > span:nth-of-type(1){
	transform: translate(1em,-1.5em);
	font-size: 1.1em;
}

.works-title > span:nth-of-type(2){
	transform: translate(-0.25em,-0.75em);
	font-size: 0.9em;
}

.works-title > span:nth-of-type(3){
	transform: translate(-0.125em,-0.125em);
	font-size: 1.1em;
}

.works-title > span:nth-of-type(4){
	
}

.works-title:before,
.works-title:after{
	content: "";
	position: absolute;
	z-index: -1;
}

.works-title:before{
	right: 1.5em;
	top: 50%;
	width: 100%;
	height: 3em;
	border-right: 1px solid #AAA;
}

.works-title:after{
	right: 0;
	bottom: 0;
	width: 5em;
	height: 100%;
	border-bottom: 1px solid #AAA;
}

.works-wrapper{
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	justify-content: space-between;
	padding-right: calc(36px * 1.5);
}


.works-wrapper > .img{
	width: 30%;
	max-width: 300px;
	flex-shrink: 0;
	flex-grow: 0;
}

.works-wrapper > .img img{
	width: 100%;
}

.works-wrapper > .content{
	padding: 0;
	padding-right: 1em;
	margin-left: 3em;
}

.works-wrapper > .content,
.works-wrapper > .content *{
	font-size: 18px;
}

.works-wrapper > .content > .work{
	margin-bottom: 3em;
}

.works-wrapper > .content > .work > .title{
	font-size: 24px;
	display: inline-block;
	position: relative;
	font-weight: normal;
	text-align: left;
	color: #FFF;
	padding: 0.125em 2em;
	margin: 0 0 0.5em;
	text-shadow: 2px 2px 10px #666;
	z-index: 100;
}

.works-wrapper > .content > .work > .title:before,
.works-wrapper > .content > .work > .title:after{
	content: "";
	position: absolute;
	display: block;
	width: calc(100% - 0.75em);
	height: calc(100% - 0.5em);
	transform: skewX(150deg);
	z-index: -1;
}

.works-wrapper > .content > .work > .title:before{
	left: 0;
	bottom: 0;
	background-color: #85a3c9;
	z-index: -1;
}

.works-wrapper > .content > .work > .title:after{
	right: 0;
	top: 0;
	background-color: #83cfc5;
	z-index: -2;
}

.works-wrapper > .content > .work > .text{
	padding-left: 0.5em;
	margin-bottom: 1.5em;
}

.works-wrapper > .content > .work > .sub{
	padding-left: 0.25em;
	font-weight: bold;
	font-size: 100%;
}

@media(max-width: 750px){
	.works-title{
		padding-right: 0.75em;
		margin-bottom: 0.25em;
	}
	
	.works-title:before{
		right: 0.5em;
		top: 50%;
	}
	
	.works-title:after{
		right: 0;
		bottom: 0;
	}
	
	.works-wrapper{
		position: relative;
		padding-right: calc(36px * 0.5);
	}
	
	.works-wrapper{
		flex-direction: column;
		align-items: center;
		
	}
	.works-wrapper > *{
		margin: 0 !important;
	}

	.works-wrapper > .content{
		order: 1;
		width: 100%;
		max-width: 100%;
		padding-top: 1em;
	}
	
	.works-wrapper > .img{
		order: 2;
		width: 250px;
		max-width: 100%;
	}
}

/* company */

.company-about-table-wrapper{
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

.company-about-table-wrapper > *{
	flex-grow: 0;
	align-items: center;
}

.company-about-table-wrapper > .shape{
	width: 235px;
}

.company-about-table-wrapper > .shape img{
	width: 100%;
	
}

.company-about-table-wrapper > .table{
	width: calc(100% - 235px - 50px);
}

.company-about-table-wrapper > .table table{
	width: 100%;
}


.company-about-table-wrapper > .table table th{
	width: 15vw;
}


.company-about-table-wrapper > .table table tr > *{
	border-bottom: 1px solid #333;
	font-size: 26px;
	padding: 0.5em;
	word-break: break-all;
}

.company-about-table-wrapper > .table table tr > *:not(:last-child){
	border-right: 1px solid #333;
}

@media(max-width: 960px){
	.company-about-table-wrapper{
		display: block;
		position: relative;
		padding-top: 5px;
		padding-bottom: 15px;
	}
	
	.company-about-table-wrapper > .shape{
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		z-index: -1;
	}
	
	.company-about-table-wrapper > .shape img{
		width: auto;
		height: 100%;
	}
	
	.company-about-table-wrapper > .table{
		width: 100%;
		padding-left: 10%;
	}
	
	.company-about-table-wrapper > .table table tr > *{
		font-size: 22px;
		text-shadow: 2px 0 5px #FFF, 2px 2px 5px #FFF, 2px -2px 5px #FFF, -2px 0 5px #FFF, -2px 2px 5px #FFF, -2px -2px 5px #FFF, 0 0 5px #FFF, 0 2px 5px #FFF, 0 -2px 5px #FFF;
	}
	
}

@media(max-width: 640px){
	.company-about-table-wrapper{
		padding: 0;
	}
	.company-about-table-wrapper > .shape{
		width: 100%;
	}
	.company-about-table-wrapper > .shape img{
		width: 100%;
	}
	.company-about-table-wrapper > .table{
		padding: 0;
		background-color: rgba(255,255,255,0.25);
	}
	
	.company-about-table-wrapper > .table table tr{
		display: block;
		margin-bottom: 1em;
	}
	
	.company-about-table-wrapper > .table table tr > *{
		display: block;
		width: 100%;
		padding: 0.25em 0.5em;
		border-top: none !important;
		border-right: none !important;
		border-left: none !important;
		border-bottom: 1px solid #333;
	}
	
	.company-about-table-wrapper > .table table tr td{
		padding-left: 1em;
		font-size: 20px;
		border: none !important;
	}
}

@media(max-width: 540px){
	.company-about-table-wrapper > .table table tr > *{
		font-size: 5.5vw;
	}
	
	.company-about-table-wrapper > .table table tr td{
		font-size: 5vw;
	}
}

.company-about-access-wrapper{
	
}

.company-about-access-wrapper .access{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	margin: 50px 0;
}

.company-about-access-wrapper .access:nth-of-type(2n){
	flex-direction: row-reverse;
}

.company-about-access-wrapper .access > *{
	flex-grow: 0;
	flex-shrink: 0;
}

.company-about-access-wrapper .access > .address{
	width: calc(100% / 3 * 1 - 25px);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.company-about-access-wrapper .access:nth-of-type(2n + 1) > .address{
	align-items: flex-end;
}

.company-about-access-wrapper .access > .address > .title{
	font-size: 24px;
	display: inline-block;
	position: relative;
	font-weight: normal;
	text-align: left;
	color: #FFF;
	padding: 0.125em 2em;
	margin: 0 0 0.5em;
	text-shadow: 2px 2px 10px #666;
	z-index: 100;
}

.company-about-access-wrapper .access > .address > .title:before,
.company-about-access-wrapper .access > .address > .title:after{
	content: "";
	position: absolute;
	display: block;
	width: calc(100% - 0.75em);
	height: calc(100% - 0.5em);
	transform: skewX(150deg);
	z-index: -1;
}

.company-about-access-wrapper .access > .address > .title:before{
	left: 0;
	bottom: 0;
	background-color: #85a3c9;
	z-index: -1;
}

.company-about-access-wrapper .access > .address > .title:after{
	right: 0;
	top: 0;
	background-color: #83cfc5;
	z-index: -2;
}

.company-about-access-wrapper .access > .address > p{
	width: 100%;
}


.company-about-access-wrapper .access > .map{
	width: calc(100% / 3 * 2 - 25px);
	position: relative;
	height: 0;
	padding-top: calc(100% / 2 / 5 * 3);
	overflow: hidden;
}

.company-about-access-wrapper .access > .map > iframe{
	position: absolute;
	top: 0; 
	left: 0;
	width: 100%;
	height: 100%;
}

@media(max-width: 960px){
	.company-about-access-wrapper .access{
		flex-direction: column !important;
	}
	
	.company-about-access-wrapper .access > *{
		width: 100% !important;
	}
	
	.company-about-access-wrapper .access > .address{
		align-items: flex-start !important;
	}
	
	.company-about-access-wrapper .access > .map{
		padding-top: calc(100% / 5 * 3);
	}
}



/* news */
.news-layout-wrapper{
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: space-between;
}

.news-layout-wrapper > *{
	flex-grow: 0;
	flex-shrink: 0;
}

.news-layout-wrapper > .main{
	width: calc(100% - 300px - 50px);
}

.news-layout-wrapper > .sidebar{
	width: 300px;
}

@media(max-width: 960px){
	.news-layout-wrapper{
		flex-direction: column;
	}
	
	.news-layout-wrapper > *{
		width: 100% !important;
		margin-bottom: 25px;
	}
}

.news-article{
	border-bottom: 2px solid #DDD;
	padding: 15px 0 10px;
}

.news-article:first-of-type{
	padding-top: 0;
}

.news-article .news-article-header{
	font-size: 34px;
	font-weight: normal;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	margin-bottom: 0.5em;
}

@media(max-width: 540px){
	.news-article .news-article-header{
		font-size: 8vw;
	}
}

.news-article .news-article-header a{
	font-size: inherit;
	color: inherit;
	text-decoration: none;
	font-family: inherit;
}

.news-article .date{
	margin: 0;
}

.news-article .body{
	margin: 1em 0;
}

.news-article .body img{
	max-width: 100%;
}

.news-article .cate{
	margin: 1em 0;
}

.news-pager-wrapper {
	margin: 15px 0;
}

.news-pager-wrapper > ul{
	display: flex;
	align-items: stretch;
	justify-content: center;
	flex-wrap: wrap;
	padding: 0;
	margin: 0;
	list-style: none;
}

.news-pager-wrapper > ul > li{
	flex-grow: 0;
	flex-shrink: 0;
	margin: 5px;
}

.news-pager-wrapper > ul > li > *{
	border: 2px solid #83cfc5;
	font-size: 18px;
	padding: 0.25em 0.5em;
	color: #83cfc5;
}

.news-pager-wrapper > ul > li > a{
	text-decoration: none;
	transition: color 0.25s, background-color 0.25s;
}

.news-pager-wrapper > ul > li > span,
.news-pager-wrapper > ul > li > a:hover{
	background-color: #83cfc5;
	color: #FFF;
}


.news-sidebar-nav-wrapper{
	display: flex;
	flex-direction: column;
	
}

.news-sidebar-nav-wrapper > *{
	align-items: stretch;
	flex-grow: 0;
	flex-shrink: 0;
	margin-bottom: 15px;
	background-color: #EEE;
	padding: 10px;
}

@media(max-width: 960px){
	.news-sidebar-nav-wrapper{
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.news-sidebar-nav-wrapper > *{
		align-items: flex-start;
		width: calc(100% / 2 - 1%);
	}
}

@media(max-width: 540px){
	.news-sidebar-nav-wrapper{
		flex-direction: column;
	}
	
	.news-sidebar-nav-wrapper > *{
		align-items: stretch;
		width: 100%;
	}
}

.news-nav-header{
	font-size: 22px;
	font-weight: normal;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	margin-bottom: 0.5em;
	padding: 0;
}

.news-sidebar-nav-wrapper > * ul{
	padding: 0;
	list-style: none;
	margin: 10px 0;
}

.news-sidebar-nav-wrapper > * ul > li{
	position: relative;
	padding-left: 1em;
}

.news-sidebar-nav-wrapper > * ul > li:before{
	content: "・";
	font-weight: bold;
	position: absolute;
	top: 0.125em;
	left: 0;
	
}

.news-nav-search-wrapper{
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	padding: 0;
	margin: 10px 0;
}

.news-nav-search-wrapper > * input{
	width: 100%;
}

.news-nav-search-wrapper .textbox{
	flex-grow: 1;
	flex-shrink: 1;
}

.news-nav-search-wrapper .button{
	flex-grow: 0;
	flex-shrink: 0;
	margin-left: 15px;
}

.news-nav-rss-wrapper{
	margin: 10px 0;
}

/* buy */
.buy-items-form{
	margin: 50px 0;
}

.buy-cate-wrapper{
	margin: 1em 0;
}

.buy-items-wrapper > ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	padding: 0;
	list-style: none;
}

.buy-items-wrapper > ul > li{
	width: calc(100% / 6 - 1% - 0.25px);
	margin: 15px 0.5%;
	padding: 5px;
	border: 2px solid #EEE;
}

.buy-items-wrapper > ul > li .img img{
	width: 100%;
	height: auto;
}

.buy-items-wrapper > ul > li .info .text{
	display: block;
	margin: 0.5em auto;
	padding: 0;
	text-align: center;
	word-break: break-all;
}

.buy-items-wrapper > ul > li .info .price{
	display: block;
	margin: 0.5em auto;
	padding: 0;
	color: #ff4500;
	text-align: center;
}

@media(max-width: 1100px){
	.buy-items-wrapper > ul > li{
		width: calc(100% / 5 - 1%);
	}
}

@media(max-width: 860px){
	.buy-items-wrapper > ul > li{
		width: calc(100% / 3 - 1%);
	}
}

@media(max-width: 540px){
	.buy-items-wrapper > ul > li{
		width: calc(100% / 2 - 1%);
	}
}

.buy-pager-wrapper > ul{
	display: flex;
	align-items: stretch;
	justify-content: center;
	flex-wrap: wrap;
	padding: 0;
	list-style: none;
}

.buy-pager-wrapper > ul > li{
	flex-grow: 0;
	flex-shrink: 0;
	margin: 5px;
}

.buy-pager-wrapper > ul > li > *{
	border: 2px solid #83cfc5;
	font-size: 18px;
	padding: 0.25em 0.5em;
	color: #83cfc5;
}

.buy-pager-wrapper > ul > li > a{
	text-decoration: none;
	transition: color 0.25s, background-color 0.25s;
}

.buy-pager-wrapper > ul > li > span,
.buy-pager-wrapper > ul > li > a:hover{
	background-color: #83cfc5;
	color: #FFF;
}

/* contact */

.contact-telfax > a{
	display: block;
	border: 1px solid #aaa;
	padding: 10px;
	text-align: center;
	text-decoration: none !important;
	color: #333 !important;

	cursor: default;
}

.contact-telfax > a > span{
	display: block;
	margin: 15px 0;
}

.contact-telfax > a > span.no{
	font-size: 32px !important;
	font-family: 'M PLUS Rounded 1c','M PLUS Rounded 1c ttf','Helvetica','Arial','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';

}

.contact-telfax > a > span.comment{
	font-size: 18px !important;
}

@media(max-width: 640px){
	.contact-telfax > a > span.no{
		font-size: 6.5vw !important;
	}
}

.mailform-table{
	width: 100%;
	margin: 50px 0;
}

.mailform-table{
	width: 100%;
}

.mailform-table tr > *{
	border: none;
	border-bottom: 1px solid #333;
	padding: 1em;
	font-size: 18px;
}

.mailform-table tr > * .msg{
	font-weight: bold;
	color: red;
}

.mailform-table tr > *:not(:last-child){
	border-right: 1px solid #333;
}

.mailform-table tr > th{
	max-width: 20em;
	width: 25%;
}

@media(max-width: 750px){
	.mailform-table tr{
		display: block;
		border-bottom: 1px solid #333;
		padding: 10px 0;
	}
	
	.mailform-table tr > *{
		display: block;
		border: none !important;
		padding: 0.25em 0.25em;
		width: 100% !important;
		max-width: 100% !important;
	}
	
}

.mailform-table tr > th > span{
	font-size: inherit;
	display: block;
	padding-left: 1.25em;
	position: relative;
}

.mailform-table tr > th.need > span:before{
	content: "※";
	font-weight: bold;
	font-size: inherit;
	position: absolute;
	top: 0;
	left: 0;
	color: red;
}

@media(max-width: 750px){
	.mailform-table tr > th > span{
		padding: 0;
	}
	
	.mailform-table tr > th.need > span:before{
		display: none;
	}
	
	.mailform-table tr > th.need > span:after{
		content: "※";
		display: inline-block;
		font-weight: bold;
		font-size: inherit;
		color: red;
		margin-left: 0.5em;
	}
}

.mailform-table tr > * input[type="text"],
.mailform-table tr > * input[type="tel"],
.mailform-table tr > * input[type="email"],
.mailform-table tr > * textarea{
	background-color: #E6F1FF;
	border: 1px solid #EEE;
}

.mailform-table tr > * input[type="text"],
.mailform-table tr > * textarea{
	width: 100%;
}

.mailform-table tr > * input[type="tel"],
.mailform-table tr > * input[type="email"]{
	max-width: 100%;
}

.mailform-table tr > * label{
	display: block;
}

.mailform-msg{
	color: red;
	font-weight: bold;
}

/* privacy */
.privacy-policy .privacy-policy-section{
	padding: 25px 5px;
}

.privacy-policy .privacy-policy-section:not(:last-of-type){
	border-bottom: 2px solid #ddd;
}

.privacy-policy .privacy-section-title{
	font-size: 22px;
	margin-bottom: 0.5em;
}

.privacy-policy .privacy-sub-title{
	font-size: 18px;
	margin-bottom: 0.5em;
	padding-left: 0.25em;
}

.privacy-policy p{
	margin: 1em 0;
	padding-left: 1em;
}

.privacy-policy dl{
	padding-left: 1em;
	margin-bottom: 1em;
}

.privacy-policy dl > dt:before{
	content: "●";
}

.privacy-policy dl > dd:before{
	content: "・";
}

.privacy-policy dl > dt{
	margin: 0.5em 0 0.25em;
}

.privacy-policy dl > dd{
	padding-left: 0.5em;
}

/* sitemap */
ul.sitemap-list{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 0;
	list-style: none;
}

.sitemap-list > li{
	flex-grow: 0;
	flex-shrink: 0;
	width: calc(100% / 4 - 10px);
	margin: 10px 10px 10px 0;
}

.sitemap-list > li > a{
	font-size: 18px;
	display: inline-block;
	padding-left: 1em;
	position: relative;
}

.sitemap-list > li > a:before{
	content: "＞";
	position: absolute;
	top: 0;
	left:0;
	text-decoration: none;
	color: #333;
	font-weight: bold;
}

@media(max-width: 960px){
	.sitemap-list > li{
		width: auto;
		margin: 10px 40px 10px 0;
	}
}