/* ===============================================================================
Reset
=============================================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a,
abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike,
strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure,
figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
    outline: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
button {border: none;}


*{
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html {font-size: 62.5%;/* 16px x 0.625 = 10px(=1rem) */}
body {
    /* font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; */
    font-size: 1.6rem;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* line-height: 1.5; */
    color: #343c44;
	overflow-x: hidden;
	font-display: swap;
}
html{overflow-x: hidden;}

section.main {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    line-height: 1.5;
}

img{
    line-height: 1;

}
/*.serif{font-family: "Noto Serif JP","游明朝","Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro","HGS明朝E","メイリオ",Meiryo,serif;}*/

a{cursor: pointer; color: #111; text-decoration: none; transition: opacity .3s, background .3s, }
a:hover{opacity: .8;}




/*---------------
【パンくず】
------------------------------*/
.breadcrumb{max-width: 1040px; margin: 0 auto;}
.breadcrumb li:after{content:'>'; display:inline-block; margin:0 1em 0; color: #fff;}
.breadcrumb li:last-of-type:after{content:'';}
.breadcrumb a,
.breadcrumb span{color: #fff !important;}
.breadcrumb a font,
.breadcrumb span font{color: #fff !important;}
.breadcrumb a:hover{text-decoration: underline;}
.breadcrumb .flx{max-width: 1236px; z-index: 10;}
@media screen and (max-width: 640px){
	.breadcrumb{display: none;}
}

/*---------------
【TOPに戻るボタン】
------------------------------*/
.totop {
    width: auto;
    position: fixed;
    bottom: 2em;
    right: 1em;
    display: none;
    z-index: 10000;
	transition: padding-bottom .3s;
}

.totop a {
    background: rgba(0,156,189,.9);
    padding: .8em;

	line-height: 1;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	-ms-align-items: center;
	align-items: center;
}
.totop a span{display: block; text-align: center; color: #fff; font-weight: 900;}
.totop a::before {
    content: '';
    margin-left: .5rem;
    width: 1.2rem;
    height: 1.2rem;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(-45deg) translate(-30%);
    transform: rotate(-45deg) translate(-30%);
    display: inline-block;
}

@media screen and (min-width: 768.1px){
	.totop:hover{
		opacity: .8;
		padding-bottom:1em ;
	}
}