@charset "utf-8";

@import url(reset.css);
@import url(normalize.css);
@import url(animation.css);
@import url(nav.css);
@import url(form.css);
@import url('https://fonts.googleapis.com/css2?family=Hina+Mincho&family=Zen+Kaku+Gothic+New&display=swap');


/*-----------------------------
	root設定
------------------------------*/

:root {
	--color: 59, 183, 203;
	--color-hover: 141, 218, 226;
	--color-bk: 40, 40, 40;
	--color-bk-hover: 53, 53, 53;
	--color-wh: 255, 255, 255;
	--color-wh-hover: 238, 238, 238;
	--color-gray: 151, 151, 151;
	--transition: all .25s;
	--border-radius: 4px;
}


/*-----------------------------
	初期設定
------------------------------*/

html,body {
	width: 100%;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;
	text-align: left;
	font-size: 10px;
	line-height: 1.8;
	letter-spacing: 0.05em;
	color: rgb(var(--color-bk));
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-variant-east-asian: simplified;
	font-feature-settings: "palt" 1;
	scroll-behavior: smooth;
	scroll-padding-top: 100px;
}
body {
	position: relative;
	height: 100%;
	background: rgb(var(--color-wh));
}
html.open {
	overflow: hidden;
}

.pc {
	display: inherit !important;
}
.sp {
	display: none !important;
}

*/
* {
    margin:0;
    padding:0;
}
* {
    min-width: 0;
    min-height: 0;
}
a,
a:active,
a:visited,
a:focus  {
	color: rgb(var(--color-bk));
	text-decoration: none;
	outline: none;
	transition: var(--transition);
}

::selection {
	color: rgb(var(--color-wh)) !important;
	background: rgb(var(--color-bk)) !important;
}
::-moz-selection {
	color: rgb(var(--color-wh)) !important;
	background: rgb(var(--color-bk)) !important;
}
img,
img a {
	border: none;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
}
ul,li {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
.content li {
	margin-left: 4rem;
	list-style: disc;
}
h1, h2, h3, h4 {
	line-height: 1.4em;
}
h1 {
	font-size: 4.5rem;
	font-weight: 700;
}
h2 {
	font-size: 4.5rem;
	font-weight: 500;
}
h3 {
	font-size: 3.2rem;
	font-weight: 500;
}
h4 {
	font-size: 2rem;
	font-weight: 500;
}
li, p {
	font-size: 1.4rem;
	font-weight: 400;
}

@media screen and (max-width: 1600px)
{
h1, h2 {
	font-size: 4rem;
}
h3 {
	font-size: 3rem;
}
}

@media screen and (max-width: 1360px)
{
h1, h2 {
	font-size: 3.5rem;
}
h3 {
	font-size: 2.8rem;
}
h4 {
	font-size: 1.8rem;
}
}

@media screen and (max-width: 750px)
{
h1, h2 {
	font-size: 3rem;
}
h3 {
	font-size: 2.5rem;
}
h4 {
	font-size: 1.6rem;
}
}

.heading {
	font-family: "Hina Mincho", serif;
	margin-bottom: 2rem;
}
h2.heading {
	font-size: 3.6rem;
}
h3.heading {
	font-size: 2.6rem;
}
.heading span {
	font-size: 0.6em;
	margin-left: 1rem;
}
@media screen and (max-width: 750px)
{
h2.heading {
	font-size: 3rem;
}
h3.heading {
	font-size: 2rem;
}	
}

.subtitle {
	font-size: 1.5rem;
	font-weight: 500;
	letter-spacing: 0;
	color: rgba(var(--color-gray), 1);
}

.bg_gray {
	background-color: rgb(242,242,242);
}

.align_right {
	display: flex;
	justify-content: flex-end;
}

.fixed_button {
	display: none;
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	z-index: 100;
}
.fixed_button a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 140px;
	height: auto;
	max-width: 20vw;
	aspect-ratio: 1 / 1;
	border-radius: 9999px;
	background: rgb(var(--color));
	color: #fff;
	font-size: min(2.5vw,1.6rem);
	font-weight: 700;
	text-align: center;
}
@media screen and (max-width: 750px)
{
.fixed_button {
	display: block;
}
}



/* ボタン */

a.button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	min-width: 10rem;
	height: 5.6rem;
	width: fit-content;
	margin-top: 3rem;
	padding: 0 5.6rem;
	background: rgb(var(--color));
	color: rgb(var(--color-wh));
	font-size: 1.5rem;
	font-weight: 600;
	letter-spacing: 0;
	border-radius: var(--border-radius);
	box-sizing: border-box;
	transition: var(--transition);
}
a.button:hover {
	background-color: rgb(var(--color-hover));
}
@media screen and (max-width: 1200px)
{
a.button {
	height: 5.2rem;
	font-size: 1.4rem;
	padding: 0 4rem;
}
}

/* Youtubeレスポンシブ埋め込み */

.wp-block-embed-youtube > div {
	position: relative;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	margin-bottom: 20px;
}
.wp-block-embed-youtube iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}



/*-----------------------------
	共通
------------------------------*/

.main_contents {
	position: relative;
	z-index: 0;
}
.main_contents_bg01,
.main_contents_bg02 {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: repeat;
	background-size: auto;
	z-index: 1;
}
.main_contents_bg01 {
	opacity: .9;
	background-image: url(../images/noise.png);
	mix-blend-mode: overlay;
}
.main_contents_bg02 {
	opacity: .5;
	background-image: url(../images/bg.png);
	mix-blend-mode: multiply;
}

.page,
.single {
	margin-bottom: 200px;
}

/* コンテンツサイズ指定
------------------------------*/

.block_width_small {
	position: relative;
	display: block;
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
	padding: 0 3rem;
	box-sizing: border-box;
	z-index: 1;
}
.block_width_normal {
	position: relative;
	display: block;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 3rem;
	box-sizing: border-box;
	z-index: 1;
}
.block_width_large {
	position: relative;
	display: block;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0 3rem;
	box-sizing: border-box;
	z-index: 1;
}
.block_width_full {
	position: relative;
	display: block;
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}

@media screen and (max-width: 1200px)
{
.block_width_normal,
.block_width_large {
	padding: 0 2rem;
}
}


/* コンテンツ見出し共通
------------------------------*/
.section_header {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 4rem;
}
.section_header_vertical {
	flex-direction: column;
	margin-bottom: 0;
}
@media screen and (max-width: 990px)
{
.section_header_vertical {
	flex-direction: row;
	margin-bottom: 4rem;
}
}
@media screen and (max-width: 750px)
{
.section_header_vertical {
	flex-direction: row;
	margin-bottom: 4rem;
}
}

/* テキストリストコンテンツ
------------------------------*/
.text_list_contents {
	display: flex;
	justify-content: space-between;
	width: 100%;
	box-sizing: border-box;
	gap: 6rem;
}
.text_list_contents > div:first-child {
	flex: 1;
}
.text_list_contents > div:last-child {
	width: 65%;
}
@media screen and (max-width: 990px)
{
.text_list_contents {
	flex-direction: column;
	gap: 0;
}
.text_list_contents > div:last-child {
	width: 100%;
}
}

.content_text_list {
	border-top: 1px dotted rgb(var(--color-gray));
}
.content_text_list > div {
	border-bottom: 1px dotted rgb(var(--color-gray));
}
.content_text_list > div a {
	display: block;
	width: 100%;
	padding: 2rem 0;
}
.content_text_list > div a:hover {
	background-color: rgb(var(--color-wh-hover));
}


/* 概要リスト
------------------------------*/
.overview_list {
	border-bottom: 1px dotted rgb(var(--color-gray));
}
.overview {
	display: flex;
	justify-content: space-between;
	padding: 4rem 0;
	border-top: 1px dotted rgb(var(--color-gray));
}
.overview > h3 {
	display: block;
	font-size: 1.6rem;
	width: 200px;
	margin-bottom: 0 !important;
}
.overview p,
.overview .article_img {
	margin-bottom: 0 !important;
}
.overview > div {
	flex: 1;
}

@media screen and (max-width: 750px)
{
.overview > h3 {
	font-size: 1.5rem;
	width: 100px;
}
}


/* コンテンツサムネイル
------------------------------*/
.list_thumb {
	display: block;
	width: 100%;
	height: auto;
}
.thumb_img {
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 10px;
	aspect-ratio: 16 / 9;
	border-radius: var(--border-radius);
	overflow: hidden;
}
.list_thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: var(--transition);
}
.list_thumb:hover img {
	transform: scale(1.05);
}
.thumb_info h4 {
	font-size: 2rem;
}
.thumb_info h4 span {
	font-size: 1.2rem;
}
.thumb_info p {
	font-size: 1.2rem;
	line-height: 1.5em;
	margin: 5px 0;
}


/* スライドコンテンツ
------------------------------*/
.message_slider .slick-slide,
.content_slider .slick-slide {
	margin: 0 5px;
}
.message_slider .slick-list,
.content_slider .slick-list {
	overflow: visible;
	margin: 0 -5px;
}


/* アーカイブページ
------------------------------*/
.content_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 40px 10px;
}
.content_list .list_thumb {
	width: calc((100% - 20px) / 3);
}
@media screen and (max-width: 990px)
{
.content_list .list_thumb {
	width: calc((100% - 10px) / 2);
}
}
@media screen and (max-width: 750px)
{
.content_list .list_thumb {
	width: 100%;
}
}


/* ページネーション
------------------------------*/
#page_nav {
	text-align: center;
	margin-top: 60px;
}
.wp-pagenavi a, .wp-pagenavi span {
	display: inline-block;
	font-size: 1.2rem;
	text-align: center;
	width: 30px;
	height: 30px;
	line-height: 30px;
	padding: 0;
	margin: 3px;
	letter-spacing: 0em;
	border-radius: 50%;
}
.wp-pagenavi span.current {
	background: rgb(var(--color-bk));
	color: rgb(var(--color-wh));
}


/* フッター
------------------------------*/
#footer {
	background: rgb(var(--color));
}
#footer a {
	color: rgb(var(--color-wh)) !important;
}

.footer_line {
	position: absolute;
	bottom: 100%;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	transform: rotate(180deg);
	z-index: 1;
}
.footer_line svg {
	position: relative;
	display: block;
	width: 100%;
	height: 100px;
}
.footer_line path {
	fill: rgb(var(--color));
}

.footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.footer svg {
	width: 260px;
	max-width: 100%;
}
.footer svg .st0 {
	fill: rgb(var(--color-wh));
}

.footer > div {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.footer ul {
	display: flex;
	justify-content: center;
	width: 100%;
	gap: 2rem;
}
.footer ul li {
	font-size: 1.7rem;
	letter-spacing: -.02em;
}
.footer ul i {
	font-size: 2rem;
}

.footer .copyright {
	width: 100%;
	text-align: center;
	font-size: 1.4rem;
	color: rgb(var(--color-wh)) !important;
}


@media screen and (max-width: 990px)
{
.footer_line svg {
	height: 10vw;
}
.footer > div,
.footer > div:last-child {
	flex-direction: column;
	align-items: flex-start;
	gap: 2rem;
}
.footer ul {
	justify-content: flex-start;
	flex-wrap: wrap;
}
.footer .copyright {
	text-align: inherit;
}
}


/*-----------------------------
	トップページ
------------------------------*/
#top_head {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100vw;
	width: 100dvw;
	height: auto;
	max-height: 100vh;
	max-height: 100dvh;
	padding-top: 2rem;
}
#top_head img {
	width: 100%;
	height: 100%;
	max-height: 100vh;
	max-height: 100dvh;
	object-fit: contain;
	box-sizing: border-box;
}

.section01 {
	padding-top: 200px;
	padding-bottom: 100px;
	background: rgba(238, 244, 250, 1);
}
.section_line01 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	z-index: 1;
}
.section_line01 svg {
	position: relative;
	display: block;
	width: 100%;
	height: 100px;
}
.section_line01 path {
	fill: #fff;
}

.section02 {
	padding-top: 200px;
	padding-bottom: 100px;
	background: rgba(232, 243, 229, 1);
}
.section_line02 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
}
.section_line02 svg {
	position: relative;
	display: block;
	width: calc(100% + 1.3px);
	height: 100px;
}
.section_line02 .shape-fill {
	fill: rgba(238, 244, 250, 1);
}

.section03 {
	padding-top: 200px;
	padding-bottom: 100px;
	background: rgba(241, 241, 227, 1);
}
.section_line03 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}
.section_line03 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 100px;
    transform: rotateY(180deg);
}
.section_line03 .shape-fill {
    fill: rgba(232, 243, 229, 1);
}

.section04 {
	padding-top: 200px;
	padding-bottom: 200px;
	background: rgba(229, 239, 235, 1);
}
.section_line04 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
}
.section_line04 svg {
	position: relative;
	display: block;
	width: calc(100% + 1.3px);
	height: 100px;
}
.section_line04 .shape-fill {
	fill: rgba(241, 241, 227, 1);
}

@media screen and (max-width: 990px)
{
.section01 {
	padding-top: 20vw;
}
.section_line01 svg {
	height: 10vw;
}	
}

.woods {
	position: absolute;
	width: auto;
	height: auto;
	max-width: 70%;
}
.woods img {
	width: 100%;
}
.woods01 {
	left: 4rem;
	width: 500px;
}
.woods02 {
	right: 4rem;
	width: 500px;
}
.woods03 {
	left: 4rem;
	width: 250px;
	max-width: 40%;
}


/* トップページコンセプト
------------------------------*/
.top_concept {
	display: flex;
	justify-content: space-between;
	gap: 6rem;
	margin-bottom: 100px;
}
.top_concept_img {
	display: flex;
	align-items: center;
	width: 40%;
}
.top_concept_text {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;
	flex: 1;
}
.top_concept h2 {
	width: 100%;
}
.top_concept p {
	flex: 1;
}
.top_concept img {
	width: 100%;
	mix-blend-mode: darken;
}

@media screen and (max-width: 990px)
{
.top_concept {
	flex-direction: column-reverse;
}
.top_concept_img {
	width: 100%;
}
}

/* トップページ企業連名
------------------------------*/
.top_company_list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;
}
.top_company_list h2 {
	width: 100%;
}
.top_company_list p span:after {
	content: " / ";
}
.top_company_list p span:last-child:after {
	content: "";
}


/* トップページメッセージ
------------------------------*/
.top_message_list .slick-track {
  display: flex;
}
.top_message_list .slick-slide {
  height: auto !important;
}

.top_message {
	display: flex !important;
	flex-direction: column;
	justify-content: space-between;
	padding: 4rem;
	background: #efefef;
	border-radius: var(--border-radius);
}
p.message {
	flex: 1;
	font-size: 1.6rem;
	font-style: italic;
	margin-bottom: 2rem;
}
p.message_opt {
	font-size: 1.2rem;
	text-align: right;
}


.top_signature_number {
	display: flex;
	flex-direction: column;
	width: 100%;
	background: #efefef;
	border: 1px solid rgb(var(--color-bk));
	border-radius: var(--border-radius);
	box-sizing: border-box;
}
.top_signature_number .num_total {
	width: 100%;
	padding: 3rem;
	text-align: center;
	font-size: min(5vw, 30px);
	border-bottom: 1px dotted rgb(var(--color-bk));
	box-sizing: border-box;
}
.top_signature_number .num_kyoto {
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
}
.top_signature_number .num_kyoto div {
	width: 100%;
	padding: 3rem;
	text-align: center;
	font-size: min(4vw, 25px);
	box-sizing: border-box;
}
.top_signature_number .num_kyoto div:first-child {
	border-right: 1px dotted rgb(var(--color-bk));
}



/* トップページ記事一覧サムネイルアスペクト比
------------------------------*/

.top_product .thumb_img {
	aspect-ratio: 1 / 1;
}
.top_team .thumb_img {
	aspect-ratio: 5 / 4;
}
.top_library .thumb_img {
	aspect-ratio: 16 / 9;
}


/*-----------------------------
	アーカイブページ
------------------------------*/



/*-----------------------------
	記事
------------------------------*/

/* シングル・固定ページ共通
------------------------------*/

.page_head {
	padding: 60px 0;
}
.page_head > div {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 10rem;
}
.page_head_bg {
	position: relative;
	padding: 60px 0;
	background-size: cover;
	background-position: center center;
}
.page_head_bg > div {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: calc(100vh - 120px - 85.5px);
	height: calc(100dvh - 120px - 85.5px);
	z-index: 100;
}
@media screen and (max-width: 1600px)
{
.page_head_bg > div {
	height: calc(100vh - 120px - 82.5px);
	height: calc(100dvh - 120px - 82.5px);
}	
}
@media screen and (max-width: 1360px)
{
.page_head_bg > div {
	height: calc(100vh - 120px - 70.5px);
	height: calc(100dvh - 120px - 70.5px);
}	
}
@media screen and (max-width: 1200px)
{
.page_head_bg > div {
	height: calc(100vh - 120px - 64px);
	height: calc(100dvh - 120px - 64px);
}	
}
.page_head_bg:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	pointer-events: none;
}
.page_head > div .breadcrumbs a,
.page_head > div .breadcrumbs {
	color: rgb(var(--color-gray));
	font-size: 1.2rem;
	font-weight: 400;
}
@media screen and (max-width: 750px)
{
.page_head > div .breadcrumbs a,
.page_head > div .breadcrumbs {
	font-size: 1rem;
}
}
.page_head > div h1 {
	font-weight: 500;
	line-height: 1.2em;
	margin-top: 4rem;
	margin-bottom: 2rem;
}
.page_head_bg > div h1 {
	text-align: center;
	color: rgb(var(--color-wh));
}
.page_head > div h1 span {
	font-size: 0.75em;
}
.page_head > div p {
	font-size: 1.2rem;
}
@media screen and (max-width: 750px)
{
.page_head > div p {
	font-size: 1rem;
}
}

.content h2,
.content h3,
.content h4,
.content p,
.content ul,
.content img {
	margin-bottom: 2rem;
}
.content p a {
	text-decoration: underline;
}

.content .thumbnail_img img {
	width: 100%;
	margin-bottom: 4rem;
}
@media screen and (max-width: 750px)
{
.content .thumbnail_img {
	width: 100vw;
	max-width: none;
	height: auto;
	margin-left: calc(50% - 50vw);
}
}

.article_img,
.article_img img {
	height: auto;
	max-width: 100%;
}
.article_img {
	margin-bottom: 2rem;
}

.share_btns {
	text-align: center;
	margin-top: 60px;
}
.share_btns p {
	text-align: center;
	font-weight: 600;
	font-size: 1.6rem;
}
.share_btns i {
	font-size: 3.6rem;
	font-weight: 400;
	margin: 10px 5px;
	color: #333;
}
.share_btns i.fa-line {
	position: relative;
	top: -1px;
	font-size: 3.2rem;
}


/* NEWSページ
------------------------------*/

.news_page {
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
.news_page div {
	width: 100%;
	height: 100px;
}
.news_page div a {
	position: relative;
	display: flex;
	width: 100%;
	height: 100px;
	justify-content: center;
	align-items: center;
	font-size: 1.4rem;
}
.news_page div a:hover {
	color: rgb(var(--color-wh));
	opacity: 1;
}
.news_page div a:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: rgb(var(--color-bk));
	transition: transform .5s cubic-bezier(.5,0,0,1);
	transform: scale(0,1);
    transform-origin: right center;
	z-index: -1;
}
.news_page div a:hover:before {
	transition: transform .5s cubic-bezier(.5,0,0,1);
	transform: scale(1,1);
    transform-origin: left center;
}
.news_page .page_center {
	display: block;
	width: 1px;
	background: rgb(var(--color-bk));
}


/* About
------------------------------*/

#about .content.center_content {
	width: fit-content;
	margin: 0 auto;
}


/*-----------------------------
	タブレット
------------------------------*/

@media screen and (max-width: 990px)
{
	
.top_sliders {
	height: 72rem;
}
.top_sliders > div:nth-child(1) {
	grid-row: 1;
	grid-column: 1 / 3;
}
.top_sliders > div:nth-child(2) {
	grid-row: 2;
	grid-column: 1;
}
.top_sliders > div:nth-child(3) {
	grid-row: 2;
	grid-column: 2;
}
	
}


/*-----------------------------
	スマホ
------------------------------*/

@media screen and (max-width: 720px)
{

.pc {
	display: none !important;
}
.sp {
	display: inherit !important;
}

/*-----------------------------
	共通
------------------------------*/

/* コンテンツ共通 */



/* トップページ
------------------------------*/


/* ニュース・チーム一覧ページ
------------------------------*/
.news_list > div,
.team_list > div {
	width: 100%;
}



/* トリック一覧ページ
------------------------------*/
.tag_rename,
.style_rename {
	display: none;
}
.trick_archive {
	flex-direction: column;
	gap: 40px;
}

.searchfilter {
	width: calc(100% - 40px);
	max-width: none;
	margin: 0;
	padding: 20px;
	border: 1px solid rgb(var(--color-bk));
}
.searchfilter > form {
	display: none;
}
.searchfilter h3 {
	position: relative;
	display: block;
	width: 100%;
	font-size: 1.6rem;
	cursor: pointer;
}
.searchfilter label {
	font-size: clamp(10px, 2vw, 14px);
}

.searchfilter h3:after {
	position: absolute;
	right: 0;
	display: inline-block;
	content: '\f107';
	font-family: FontAwesome;
	font-size: 1em;
}
.searchfilter h3.active:after {
	content: '\f106';
}

.trick_wrap {
	width: 100%;
}



/* ショップリスト
------------------------------*/

.shoplist > div {
	width: 100%;
}
.shoplist > div:first-of-type {
	padding-top: 20px;
	border-top: 1px solid rgb(var(--color-bk));
}

}



/* パディング用 */
.p20 {
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}
.p40 {
	padding-top: 40px !important;
	padding-bottom: 40px !important;
}
.p60 {
	padding-top: 60px !important;
	padding-bottom: 60px !important;
}
.p80 {
	padding-top: 80px !important;
	padding-bottom: 80px !important;
}
.p100 {
	padding-top: 100px !important;
	padding-bottom: 100px !important;
}
.p200 {
	padding-top: 200px !important;
	padding-bottom: 200px !important;
}

.pt20 {
	padding-top: 20px !important;
}
.pt40 {
	padding-top: 40px !important;
}
.pt60 {
	padding-top: 60px !important;
}
.pt80 {
	padding-top: 80px !important;
}
.pt100 {
	padding-top: 100px !important;
}
.pt200 {
	padding-top: 200px !important;
}

.pb20 {
	padding-bottom: 20px !important;
}
.pb40 {
	padding-bottom: 40px !important;
}
.pb60 {
	padding-bottom: 60px !important;
}
.pb80 {
	padding-bottom: 80px !important;
}
.pb100 {
	padding-bottom: 100px !important;
}
.pb200 {
	padding-bottom: 200px !important;
}


/* マージン用 */

.m20 {
	margin-top: 20px !important;
	margin-bottom: 20px !important;
}
.m40 {
	margin-top: 40px !important;
	margin-bottom: 40px !important;
}
.m60 {
	margin-top: 60px !important;
	margin-bottom: 60px !important;
}
.m80 {
	margin-top: 80px !important;
	margin-bottom: 80px !important;
}
.m100 {
	margin-top: 100px !important;
	margin-bottom: 100px !important;
}
.m200 {
	margin-top: 200px !important;
	margin-bottom: 200px !important;
}

.mt0 {
	margin-top: 0px !important;
}
.mt20 {
	margin-top: 20px !important;
}
.mt40 {
	margin-top: 40px !important;
}
.mt60 {
	margin-top: 60px !important;
}
.mt80 {
	margin-top: 80px !important;
}
.mt100 {
	margin-top: 100px !important;
}
.mt200 {
	margin-top: 200px !important;
}

.mb20 {
	margin-bottom: 20px !important;
}
.mb40 {
	margin-bottom: 40px !important;
}
.mb60 {
	margin-bottom: 60px !important;
}
.mb80 {
	margin-bottom: 80px !important;
}
.mb100 {
	margin-bottom: 100px !important;
}
.mb200 {
	margin-bottom: 200px !important;
}