@charset "utf-8";
/*----------------------------------------------
	root
---------------------------------------------*/
:root {
	/* 色 */
	--bk-color: #222;
	--libk-color: #545454;
	--wh-color: #fff;
	--gray-color: #F5F5F5;
	--bl-color: #2052B7;
	--libl-color: #DFEDFF;
	--rd-color: #FF276A;

	--rgb-main-color: 105, 57, 6;
	--rgb-base-color: 250, 248, 239;
	--rgb-key-color: 248, 158, 17;
	--rgb-bk-color: 47, 47, 47;
	--rgb-gray-color: 112, 112, 112;

	/* 矢印 */
	--shape-triangle-top: polygon(50% 0, 100% 100%, 0 100%);
	--shape-triangle-bottom: polygon(0 0, 100% 0, 50% 100%);
	--shape-triangle-right: polygon(0 0, 100% 50%, 0 100%);
	--shape-triangle-left: polygon(0 50%, 100% 0, 100% 100%);
	--shape-triangle-lower-left: polygon(0 0, 100% 100%, 0 100%);
	--shape-triangle-upper-left: polygon(0 0, 100% 0, 0 100%);
	--shape-triangle-lower-right: polygon(100% 0, 100% 100%, 0 100%);
	--shape-triangle-upper-right: polygon(0 0, 100% 0, 100% 100%);
}
/*----------------------------------------------
	html
---------------------------------------------*/
html { font-size: 62.5%; }
/*↑ 10pxが1remとなる様に調整*/

/*----------------------------------------------
	body
---------------------------------------------*/
body {
    position: relative;
    overflow-x: hidden;
    min-width: 100%;
    font-size: 16px;
    font-size: 1.6rem;
    font-family: "Zen Kaku Gothic New", sans-serif;
    color: #222;
    line-height: 1.6;
    transition: all 1s .2s ease;
}
body.on {
    background: #222;
    color: #fff;
}
body.on.off {
    background: #fff;
    color: #222;
}
@media (max-width: 960px) {
    body  {
      font-size: calc(16px + ((1vw - 9.6px)*(16/6)));
    }
}
@media (max-width: 768px) {
    body  {
      font-size: 1.4rem;
    }
}

/*----------------------------------------------
	a
---------------------------------------------*/
a { color: var(--bl-color); }
a:hover { color: var(--rd-color); }

/*----------------------------------------------
	br
---------------------------------------------*/
.br_pc{
    display: block;
}
.br_sp{
    display: none;
}
@media (max-width: 1100px) {
    .br_pc{
        display: none;
    }
    .br_sp{
        display: block;
    }
}

/*----------------------------------------------
	table
---------------------------------------------*/
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*----------------------------------------------
	h1,h2,h3,h4,h5,h6
---------------------------------------------*/
h1,h2,h3,h4,h5,h6{ margin: 0; }
/*----------------------------------------------
	img
---------------------------------------------*/
img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}
/*----------------------------------------------
	li
---------------------------------------------*/
li {
    list-style-type: none;
}
/*----------------------------------------------
	*
---------------------------------------------*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}