@charset "UTF-8";



/*
全サイト共通初期設定
----------------------------------------------------------------------------------------------------
html5使用、可変式（リキッドデザイン）
PCコンテンツ：横幅 1200px
モバイルブレイクポイント：768px
----------------------------------------------------------------------------------------------------
*/





/*
----------------------------------------------------------------------------------------------------
IE11用印刷設定
----------------------------------------------------------------------------------------------------
*/
@page {
	size: A4;
	margin: 12.7mm 10.5mm;
}
@media print {
	html {width: 1100px;margin: 0 auto;}
}
.printBR {page-break-before: always;}







/*
----------------------------------------------------------------------------------------------------
サイト基本設定
----------------------------------------------------------------------------------------------------
*/
html {
	font-size: 10px;
	line-height: 1.7;
}
@media screen and (max-width: 768px) {
    html {
        font-size: 8.75px;
    }
}



/* コンテンツ最大幅
--------------------------------------------------*/
.inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 5rem 0;
}
@media screen and (max-width: 768px) {
	.inner {
		padding: 4rem 0;
	}
}

@media screen and (max-width: 1200px) {
	.inner {
        max-width: 96%;
        width:100%;
    }
}

@media screen and (min-width: 769px) {
	.pc {display: block;}
	.sp {display: none;}
}
@media screen and (max-width: 768px) {
	.pc {display: none;}
	.sp {display: block;}
}





/*
----------------------------------------------------------------------------------------------------
文字サイズ・フォントファミリー
----------------------------------------------------------------------------------------------------
*/
body {
	font-size: 1.6rem;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif;
}





/*
----------------------------------------------------------------------------------------------------
[img]　画像設定
----------------------------------------------------------------------------------------------------
*/
img {
	vertical-align: bottom;
	height: auto;
}
img.noteMark {
    margin-right: 0.2em;
}






/*
----------------------------------------------------------------------------------------------------
[iframe]　下の隙間を消す
----------------------------------------------------------------------------------------------------
*/
iframe {vertical-align: bottom;}







/*
----------------------------------------------------------------------------------------------------
[a]　基本形
----------------------------------------------------------------------------------------------------
*/
a {text-decoration: none;}



/* 注意文
--------------------------------------------------*/
.note,
.noteR {
	font-size: .75rem !important;
}
.noteR {
	text-align: right !important;
}






/*
----------------------------------------------------------------------------------------------------
[table]　基本設定
----------------------------------------------------------------------------------------------------
*/
main table {
	border-collapse: collapse;
	margin: 0 auto;
}



/* [table]　横スクロール .scroll（.scroll2は表以外で使用）
----------------------------------------------------------------------------------------------------*/
main div.scroll,
main div.scroll2 {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
}
main div.scroll table {	min-width: 1100px; }

@media screen and (max-width: 1099px) {
	main div.scroll:after,
	main div.scroll2:after {
		color: #000000;
		font-size: .75rem;
		content: "表は横にスクロールできます。";
	}
	main div.scroll2:after {
		content: "横にスクロールできます。";
	}
}






/*
----------------------------------------------------------------------------------------------------
定番設定 - 吉田のお気に入り
----------------------------------------------------------------------------------------------------
*/

.marginB {margin-bottom: 0 !important;}
.marginB5 {margin-bottom: .5rem !important;}
.marginB10 {margin-bottom: 1rem !important;}
.marginB20 {margin-bottom: 2rem !important;}
.marginB30 {margin-bottom: 3rem !important;}
.marginB40 {margin-bottom: 4rem !important;}
.marginB50 {margin-bottom: 5rem !important;}
.marginB80 {margin-bottom: 8rem !important;}
.marginB100 {margin-bottom: 10rem !important;}
.marginB1em {margin-bottom: 1em !important;}
.marginB-30 {margin-bottom: -3rem !important;}

.marginT {margin-top: 0 !important;}
.marginT10 {margin-top: 1rem !important;}
.marginT20 {margin-top: 2rem !important;}
.marginT30 {margin-top: 3rem !important;}
.marginT40 {margin-top: 4rem !important;}
.marginT50 {margin-top: 5rem !important;}
.marginT1em {margin-top: 1em !important;}
.marginT-10 {margin-top: -1rem !important;}
.marginT-20 {margin-top: -2rem !important;}
.marginT-30 {margin-top: -3rem !important;}

.marginL {margin-left: 0 !important;}
.marginL10 {margin-left: 1rem !important;}
.marginL20 {margin-left: 2rem !important;}
.marginL30 {margin-left: 3rem !important;}
.marginL40 {margin-left: 4rem !important;}
.marginL50 {margin-left: 5rem !important;}
.marginL1em {margin-left: 1em !important;}
.marginL-10 {margin-left: -1rem !important;}
.marginL-20 {margin-left: -2rem !important;}
.marginLR {margin-left: 0 !important;margin-right: 0 !important;}
.marginR30 {margin-right: 3rem !important;}

.paddingL {padding-left: 0 !important;}
.paddingL10 {padding-left: 1rem !important;}
.paddingL20 {padding-left: 2rem !important;}
.paddingL30 {padding-left: 3rem !important;}
.paddingL40 {padding-left: 4rem !important;}
.paddingL50 {padding-left: 5rem !important;}
.paddingL100 {padding-left: 10rem !important;}
.paddingL1em {padding-left: 1em !important;}
.paddingL2em {padding-left: 2em !important;}
.paddingL3em {padding-left: 3em !important;}
.paddingL5em {padding-left: 5em !important;}

.paddingR {padding-right: 0 !important;}
.paddingR10 {padding-right: 1rem !important;}
.paddingR20 {padding-right: 2rem !important;}
.paddingR30 {padding-right: 3rem !important;}
.paddingR40 {padding-right: 4rem !important;}
.paddingR50 {padding-right: 5rem !important;}
.paddingR100 {padding-right: 10rem !important;}
.paddingR1em {padding-right: 1em !important;}
.paddingR2em {padding-right: 2em !important;}
.paddingR3em {padding-right: 3em !important;}
.paddingR5em {padding-right: 5em !important;}

.paddingLR10 {padding-left: 1rem !important;padding-right: 1rem !important;}
.paddingLR20 {padding-left: 2rem !important;padding-right: 2rem !important;}
.paddingLR30 {padding-left: 3rem !important;padding-right: 3rem !important;}
.paddingLR50 {padding-left: 5rem !important;padding-right: 5rem !important;}

.paddingT10 {padding-top: 1rem !important;}
.paddingT20 {padding-top: 2rem !important;}
.paddingT30 {padding-top: 3rem !important;}
.paddingT40 {padding-top: 4rem !important;}
.paddingT50 {padding-top: 5rem !important;}
.paddingTB {padding-top: 0 !important;padding-bottom: 0 !important;}
.paddingTB20 {padding-top: 2rem !important;padding-bottom: 2rem !important;}
.paddingTB30 {padding-top: 3rem !important;padding-bottom: 3rem !important;}
.paddingTB40 {padding-top: 4rem !important;padding-bottom: 4rem !important;}
.paddingTB50 {padding-top: 5rem !important;padding-bottom: 5rem !important;}

.paddingB {padding-bottom: 0 !important;}
.paddingB10 {padding-bottom: 1rem !important;}
.paddingB20 {padding-bottom: 2rem !important;}
.paddingB30 {padding-bottom: 3rem !important;}
.paddingB50 {padding-bottom: 5rem !important;}

.height1em {height: 1em !important;}
.height2em {height: 2em !important;}
.height3em {height: 3em !important;}
.height4em {height: 4em !important;}
.height5em {height: 5em !important;}
.height6em {height: 6em !important;}
.height7em {height: 7em !important;}
.height8em {height: 8em !important;}
.height9em {height: 9em !important;}
.height10em {height: 10em !important;}

.centering {
	text-align: center;
	margin: 0 auto;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}
.kome {
	padding-left: 1em !important;
	text-indent: -1em !important;
}
.kome2 {
	padding-left: 2em !important;
	text-indent: -2em !important;
}
.kome3 {
	padding-left: 3em !important;
	text-indent: -3em !important;
}

.blockDiv1 {width: 100%;}
.blockDiv2 {width: 50%;}
.blockDiv3 {width: 33.333333%;}
.blockDiv3-2 {width: 66.666666%;}
.blockDiv4 {width: 25%;}
.blockDiv4-3 {width: 75%;}
.blockDiv5 {width: 20%;}
.blockDiv5-2 {width: 40%;}
.blockDiv5-3 {width: 60%;}
.blockDiv5-4 {width: 80%;}
.blockDiv63per {width: 63%;}
.blockDiv6 {width: 16.666666%;}
.blockDiv7-2 {width: 28.571428%;}
.blockDiv7-3 {width: 42.857142%;}
.blockDiv7-4 {width: 57.142857%;}
.blockDiv7-5 {width: 71.42857%;}
.blockDiv9-4 {width: 44.444444%;}

@media screen and (max-width: 768px) {
	.blockDiv2,
	.blockDiv3,
	.blockDiv3-2,
	.blockDiv4,
	.blockDiv4-2,
	.blockDiv4-3,
	.blockDiv5,
	.blockDiv5-2,
	.blockDiv5-3,
	.blockDiv5-4,
	.blockDiv63per,
	.blockDiv6,
	.blockDiv7-2,
    .blockDiv7-3,
    .blockDiv7-4,
	.blockDiv7-5,
	.blockDiv9-4 {width: 100% !important;}
}


.fontBlack {color: #000000 !important;}
.fontRed {color: #FF0000 !important;}
.fontRedBold {color: #FF0000 !important;font-weight: bold !important;}
.fontBold {font-weight: bold !important;}
.fontBoldC {font-weight: bold !important;text-align: center !important;}
.fontYellow {color: #FFFF00 !important;}
.fontYellowBold {color: #FFFF00 !important;font-weight: bold;}
.fontBlue {color: #3399FF !important;}
.fontBlueBold {color: #3399FF !important;font-weight: bold;}
.fontPurpleBold {color: #660099 !important;font-weight: bold;}
.fontRedPurpleBold {color: #990066 !important;font-weight: bold;}
.fontGreen {color: #009933 !important;}
.fontGreenBold {color: #009933 !important;font-weight: bold !important;}
.fontGreenBlueBold {color: #006666 !important;font-weight: bold !important;}
.fontGray {color: #999999 !important;}
.fontULineLightGray {
    padding-bottom: .5rem;
    border-bottom: 1px dotted #CCCCCC;
    margin-bottom: .5rem;
}
.fontWhiteBold {
    color: #FFFFFF;
    font-weight: bold;
}
.fontBorderRadius {
    border-radius: 50px;
    padding: .3em 1em !important;
    display: inline-block;
}
.kagikakkoLightGray {
    margin-bottom: .5rem;
    position: relative;
    padding-top: .5rem;
    border: 3px solid #CCCCCC;
    background-color: #FFFFFF;
}
.kagikakkoLightGray:before {
    position: absolute;
    content: "";
    top: -3px;
    left: 1.5em;
    right: 1.5em;
    border-top: 3px solid #FFFFFF;
}
.kagikakkoLightGray:after {
    position: absolute;
    content: "";
    bottom: -3px;
    left: 1.5em;
    right: 1.5em;
    border-bottom: 3px solid #FFFFFF;
}
.BG-darkWhite .kagikakkoLightGray:before {border-top: 3px solid #EBEBEB;}
.BG-darkWhite .kagikakkoLightGray:after {border-bottom: 3px solid #EBEBEB;}

.fontSmaller1size {font-size: 85% !important;}
.fontLarger1size {font-size: 115% !important;}
.fontMincho {font-family: Mincho, serif;}

.flexBoxC {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.flexBoxR {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.flexBoxL {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.flexBoxB {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.flexBoxA {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

/* flexBox内のリバース
----------------------------------------*/
.flexBoxReverse {
	flex-direction: row-reverse;
}
@media screen and (max-width: 768px) {
    .flexBoxReverse {
        flex-direction: row;
    }
}

/* flexBox内の天地位置
----------------------------------------*/
.alignItemsC {
	align-items: center;
}
.alignItemsFE {
	align-items: flex-end;
}

.BG-white {background-color: #FFFFFF;}
.BG-darkWhite {background-color: #EBEBEB;}
.BG-lightestGray {background-color: #DDDDDD;}
.BG-lightGray {background-color: #4C4C4C;color: #FFFFFF !important;}
.BG-gray {background-color: #333333;color: #FFFFFF !important;}
.BG-lightBlack {background-color: #191919;color: #FFFFFF !important;}
.BG-black {background-color: #0D0D0D;color: #FFFFFF !important;}
.BG-yellow {background-color: #FFFF00;}
.BB-gray {border-bottom: 3px solid #DDDDDD;}

.alignR {
	text-align: right !important;
}
.alignL {
	text-align: left !important;
}
.alignCandL {
	text-align: left !important;
	display: inline-block;
	margin: 0 auto 0 0;
}

@media screen and (max-width: 768px) {
	.marginT,
	.marginT10,
	.marginT20,
	.marginT30,
	.marginT40,
	.marginT50,
	.marginT1em,
	.marginT-10,
	.marginT-20 {margin-top: 0 !important;}
	
	.marginL,
	.marginL10,
	.marginL20,
	.marginL30,
	.marginL40,
	.marginL50,
	.marginL1em,
	.marginL-10,
	.marginL-20,
	.marginR30 {margin-left: 0 !important;}
	
	.paddingL,
	.paddingL10,
	.paddingL20,
	.paddingL30,
	.paddingL40,
	.paddingL50,
	.paddingL100,
	.paddingL1em,
	.paddingL2em,
	.paddingL3em {padding-left: 0 !important;}
	
    .paddingLR10,
    .paddingLR20,
    .paddingLR30,
    .paddingLR50 {padding-left: 0 !important;padding-right: 0 !important;}

	.paddingT10,
	.paddingT20,
	.paddingT30,
	.paddingT40,
	.paddingT50 {padding-top: 0 !important;}
}



/*YouTubeレスポンシブ
----------------------------------------
┌.flexBoxB or .flexBoxC(一つの場合)
　┌.flexBoxC.youtubeWrapper
　　┌.youtube
  　　<iframe>
----------------------------------------*/
.youtubeWrapper {
	margin: 0 auto;
	margin: 0;
}
.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
.youtubeWrapper.w560 {
	width: 560px;
}
.youtubeWrapper.w780 {
	width: 780px;
}
.youtubeWrapper.w750 {
	width: 750px;
}






/*gmapレスポンシブ
----------------------------------------
┌.flexBoxB or .flexBoxC(一つの場合)
　┌.flexBoxC.gmapWrapper
　　┌.gmap
  　　<iframe>
----------------------------------------*/
.gmapWrapper {
	margin: 0 auto;
	margin: 0;
}
.gmap {
	position: relative;
	width: 100%;
	padding-top: 60%;
}
.gmap iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}






/*囲み枠
----------------------------------------*/
div.border1-s-LG-p1em {
	border: 1px solid lightGray;
	padding: 1em;
}
div.border1-s-W-p1em {
	border: 1px solid #FFFFFF;
	padding: 1em;
}
p.internalLinkBtn {
    display: inline-block;
    padding: 1em 1.5em;
    background-color: #DB403E;
    min-width: 19em;
}
p.internalLinkBtn a {
    color: #FFFFFF;
}
