@charset "utf-8";
/* 千歳市特設サイトのcommon style css */
/*=========================================
		parts
=========================================*/
.link-under { 
	width: auto;
	line-height: 1.3;
}

/* 三角の括弧 */
.kagi {
	position: relative;
	display: inline-block;
}
.kagi-start { margin-right: 2px; }
.kagi-end { margin-left: 2px; }
.kagi-start:before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
}
.kagi-start:after{
	content: "";
	display: inline-block;;
	position: absolute;
	bottom: 0;
	left: 0;
}
.kagi-end:before{
	content: "";
	display: inline-block;;	
	position: absolute;
	top: 0;
	left: 0;
}
.kagi-end:after{
	content: "";
	display: inline-block;;
	position: absolute;
	bottom: 0;
	left: 0;
}

/* 子ページのタイトル */
#pagettl_wrap {
	padding: 80px 0 0;
	overflow: hidden;
	max-width: 1400px;
	width: 90%;
	margin: 0 auto;
}
#pagettl_wrap h1 {
	display: inline-block;
	margin: 0 auto;
	font-size: 40px;
}
#pagettl_wrap h1 span {
    display: block;
    font-size: 18px;
    line-height: 1.8;
    margin: 15px 0 0;
    font-family: "Noto Sans JP";
}

.middle_ttl01 {
    position: relative;
    margin: 100px auto 50px;
}
.middle_ttl01 h2 {
    position: relative;
    z-index: 2;
    font-size: 36px;
    letter-spacing: 3.57px;
}
.middle_ttl01 h2 span {
    font-size: 112px;
    font-family: Times New Roman;
    letter-spacing: 2px;
    line-height: 1;
    position: absolute;
    left: 0;
    top: -87px;
    z-index: -1;
    color: #D9F0FF;
}





/* コンテンツタイトル */
#maincontent section .ttlborder {
    text-align: center;
    margin-bottom: 3em;
    line-height: 1rem;
    padding-bottom: 1em;
    border-bottom: 2px solid #000000;
}
#maincontent section .ttlborder h2 {
    line-height: 32px;
    display: block;
    text-align: left;
    font-size: 32px;
    font-family: Times New Roman;
    letter-spacing: 2px;
}
#maincontent section .ttlborder h2 span {
    display: block;
    font-size: 38%;
	font-family: "Noto Sans JP";
    letter-spacing: 1px;
}

#maincontent section .main_ttl_block {
    text-align: center;
    margin-bottom: 3em;
    line-height: 1rem;
    padding-bottom: 1em;
}
#maincontent section .main_ttl_block h2 {
    line-height: 44px;
    display: block;
    text-align: left;
    font-size: 44px;
    font-family: Times New Roman;
    letter-spacing: 2px;
}
#maincontent section .main_ttl_block h2 span {
    display: block;
    font-size: 38%;
	font-family: "Noto Sans JP";
    letter-spacing: 1px;
}

/*フェードイン(下から)*/
.scroll {
    opacity: 0;
}
.scroll.scrollin {
    animation-name: fadeUpAnime02;
    animation-duration:1.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    padding: 0;
}
@keyframes fadeUpAnime02{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*フェードイン 画像*/
.scroll_img {
    opacity: 0;
}
.scroll_img.scroll_item {
    animation: zoom_in 1.2s ease forwards;
    opacity: 0;
}

@keyframes zoom_in {
    0% {
        transform: scale(1.4);
		opacity: 0;
    }
    100% {
        transform: scale(1.0);
		opacity: 1;
    }
}
/*フェードイン リスト*/
.delayScroll li {
    opacity: 0;
}


/*gnav */
.gnav_wrap .logo { display: none; }
.gnav_wrap nav {
	width: 94.144%;
    min-width: 1000px;
    max-width: 1366px;
    margin: 0 auto;
	padding-top: 5.9rem;
}
.border-gnav { opacity: 0; }
.gnav_wrap nav li {
    display: inline-block;
    float: left;
	margin-left: 7.467%;
}
.gnav_wrap nav li a:hover {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: “alpha( opacity=100 );	
}
.gnav_wrap nav li:first-of-type { 
	margin-left: 0;
	width: 10.431%;
}
.gnav_wrap nav li:nth-of-type(2) { width: 13.177%; }
.gnav_wrap nav li:nth-of-type(3) { width: 14.641%; }
.gnav_wrap nav li:nth-of-type(4) { width: 8.894%; }
.gnav_wrap nav li:nth-of-type(5) { width: 6.588%; }
.gnav_wrap nav li:last-of-type { width: 8.638%; }
.gnav_wrap nav li:hover .border-gnav { 
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: “alpha( opacity=100 );
	-webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    transition: 0.1s linear;
}
#pcgnav nav .nav_wrap .drop-child li {
  position: relative;
}
#pcgnav nav .nav_wrap li:hover > ul > li {
    height: auto;
    left: 0;
    list-style: none;
    transition: 0.2s;
    background: #fff;
    border-left: 4px solid #f7f700;
    border-right: 4px solid #f7f700;
	text-align: center;
}
#pcgnav nav .nav_wrap li:hover > ul > li:first-of-type {
	border-top: 4px solid #f7f700;
    border-bottom: 2px solid #f7f700;
	border-radius: 5px 5px 0 0;
	margin-top: 1rem;
}
#pcgnav nav .nav_wrap li:hover > ul > li:last-of-type {
    border-bottom:4px solid #f7f700;
	border-radius: 0 0 5px 5px;
}
#pcgnav nav .nav_wrap li:hover > ul > li a { padding: 1.8rem 0.5rem; }
#pcgnav nav .nav_wrap li ul li {
	overflow: hidden;
	height: 0;
	margin: 0;
	width: 150%;
	left: 0;
	list-style: none;
	transition: 0.2s;
	z-index: 9999;
}
#pcgnav nav .nav_wrap li ul li a p { 
	line-height: 1;
	color: #386e82;
	font-size: 16px;
	font-size: 1.6rem;
}
#pcgnav nav .nav_wrap li:hover > ul > li:hover { background: #F7F79C; }
.border-gnav {
	display: block;
    width: 90px;
    margin: 0 auto;
    clear: both;
    overflow: hidden;
}
.border-gnav:before {
    content: "";
    display: inline-block;
    background: url(../img/common/gnav-hover_l.png) no-repeat;
    background-size: contain;
    width: 10px;
    height: 6px;
    float: left;
}
.border-gnav hr {
    border-top: 5px solid #F7F700;
    width: 70px;
    display: inline-block;
    float: left;
    margin: 0;
}
.border-gnav:after {
    content: "";
    display: inline-block;
    background: url(../img/common/gnav-hover_r.png) no-repeat;
    background-size: contain;
    width: 10px;
    height: 6px;
    float: left;
}

/* 固定時 */
.gnav_wrap.fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
	background:url(../img/common/nami3.png);
	height: 12rem;
	background-size: cover;	
}
.gnav_wrap.fixed .inner { 
	margin: 0.5rem auto 0;
    clear: both;
    overflow: hidden;
    width: 85%;
}
.gnav_wrap.fixed .logo {
	display: inline-block;
    float: left;
    width: 120px;
    margin-right: 12px;
}
.gnav_wrap.fixed nav {
	padding-top: 0;
    width: calc(100% - 530px);
    min-width: auto;
    display: inline-block;
    float: left;
    margin-top: 3rem;
}
.gnav_wrap.fixed nav li { margin-left: 5.723%; }
.gnav_wrap.fixed nav li:first-of-type { 
	margin-left: 0;
	width: 12.038%;
}
.gnav_wrap.fixed nav li:nth-of-type(2) { width: 14.941%; }
.gnav_wrap.fixed nav li:nth-of-type(3) { width: 16.464%; }
.gnav_wrap.fixed nav li:nth-of-type(4) { width: 10.403%; }
.gnav_wrap.fixed nav li:nth-of-type(5) { width: 7.132%; }
.gnav_wrap.fixed nav li:last-of-type { width: 10.157%; }
.gnav_wrap.fixed .menu_wrap {
	display: inline-block;
    float: right;
    width: 370px;
    margin-top: 1.5rem;
    margin-left: 20px;
}
.gnav_wrap.fixed .menu_wrap li {
    width: 18em;
    vertical-align: middle;
}
.gnav_wrap.fixed .menu_wrap li .btn {
	width: 5em;
	display: inline-block;
	float: left;
}
.gnav_wrap.fixed .menu_wrap li .btn:first-of-type { margin-right: 5px; }
.gnav_wrap.fixed .menu_wrap .btn-cart_wrap {
    background: #D8E6E1;
    padding: 0.5rem;
    border-radius: 5px;
    box-shadow: 0 3px 1px 0px rgba(0,0,0,.05);
}
.gnav_wrap.fixed .menu_wrap .btn-cart_wrap .txt-cart {
	float: left;
    padding-top: 0.8rem;
    margin: 0 5px;
}
.gnav_wrap.fixed .menu_wrap .btn-cart_wrap .cart-inner {
    background: #fff;
    min-width: 110px;
    float: left;
}

/* パンくずリスト */
#pan_wrap {
	background: #D8033A;
}
#pan {
	border-radius: 5px;
	background: #fff;
	margin-bottom: 4rem;
}
#pan li {
    float: left;
    display: inline-block;
	padding-left: 2rem;
}
#pan li:first-child {
	padding-left: 0;
}
#pan li a {
	color: #386e82;
	display: block;
	float: left;
	position: relative;
	text-decoration: none;
	color: #fff;
    padding: 0.8rem 0 0.8rem 1rem;
}
#pan li a span { 
    margin-right: 0.8rem;
    vertical-align: bottom;
    float: left;
	width: 13px; 
}
#pan li a span img { vertical-align: middle; }
#pan li a p { float: left; }
#pan li a:hover {
	opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: “alpha( opacity=100 );
}
#pan li.visited:hover { background: #B9CCD3; }
#pan li:hover a:after { border-left: 20px solid #B9CCD3; }
#pan li > p { margin: 0.7rem; }
#pan li.visited:hover a:after { 
	border-left: 20px solid #B9CCD3;
}


/* ページャー　*/
.pager_wrap { margin-top: 6rem; }
.pager {
	border-spacing: 5px 0;
}
.pager li a {
    background: #EFEFEF;
    text-align: center;
    position: relative;
    font-size: 1.4rem;
    line-height: 3rem;
    width: 3rem;
    height: 3rem;
}
.pager li.visited a {
    background: #1595DC;
    color: #fff;
}
.pager li p {
	line-height: 3rem;
}
.pager li a:hover {
    background: #1595DC;
    color: #fff;
}


/* ステップ */
.step {
    margin-bottom: 4rem;
    background: #EEFBFE;
    padding: 2em 0;
}
.step ol {
    counter-reset: none;
    list-style: none;
    width: auto;
    position: relative;
    margin: auto;
}
.step ol::before {
    /* content: ""; */
    position: absolute;
    top: 1rem;
    left: 0;
    right: 0;
    margin: auto;
    width: 69%;
    height: 2px;
    background: #EAE8E8;
    z-index: 1;
}
.step ol li {
    text-align: center;
    position: relative;
    padding: 0 2em;
    display: table-cell;
}
.step li:before {
    content: "";
	width: 1.5em;
	height: 1.5em;
	background: #B1B1B1;
	box-sizing: border-box;
	padding: 0;
	margin: auto;
	display: inline-block;
	border-radius: 50%;
	z-index: 2;
    position: relative;
}
.step ol li:after {
    content: "";
    position: absolute;
    top: 1rem;
    left: 50%;
    width: 100%;
    height: 2px;
    background: #EAE8E8;
    z-index: 1;
}
.step ol li em { 
	display: block;
	margin-top: 0.5rem;
	font-size: 14px;
	font-size: 1.4rem;
}
.step ol li.current {
    color: #345BA0;
}
.step ol li.current:before {
    background: #345BA0;
}

.step ol li:last-of-type:after { display: none; }

/* 注意書き */
.caution { 
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.8;
	display: block;
	text-align: left;
}

/* 注意事項 */
.note { color: #bf1919; }

/* タブメニュー */
.tab-menu { border-spacing: 5px 0; }
.tab-menu li { 
	position: relative;
	margin-bottom: 15px;
}
.tab-menu li a {
    color: rgba(0,0,0,0.5);
    padding: 23px 0 20px;
    font-size: 28px;
    font-size: 2.8rem;
    text-decoration: none;
    font-weight: bold;
    text-align: center;
    display: block;
    position: relative;
    transition: 0.2s;
}
.tab-menu li a:hover {
    color: #000;
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: “alpha( opacity=100 )”;
    background: #F2F2F2;
}
.tab-menu li a.selected {
    color: #000;
    cursor: auto;
}
.tab-menu li a.selected,
.tab-menu li a:hover,
.tab-menu li a.selected:hover {
    /*background: #1595dc;
    color: #fff !important;*/
}
.tab-menu a:after {
    content: "";
    display: inline-block;
    border-bottom: 2px solid #000;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
.tab-menu .selected:after {
    border: 2px solid #000;
}
.tab-menu .selected:before {
    content: "";
    width: calc(100% - 4px);
	height: 2px;
	background: #fff;
	position: absolute;
	left: 2px;
	bottom: 0;
	z-index: 1;
}

.tab-menu.col-2 > .col {
    width: calc(50%) !important;
}
.tab-menu.col-2 > .col:nth-child(odd) {
    margin: 0 !important;
}
.tab-menu { margin-bottom: 5rem; }
.tab-menu.col-3 > .col {
    width: calc(100%/3);
    margin-left: 0;
}
.tab-menu.col-3 > .col:nth-child(3n+1) { margin-left: 0; }

/* ボタンタブメニュー */
.btn-tabmenu {
	background: #fff;
	padding: 1rem 1rem 0; 
	margin-bottom: 2rem;
	border-radius: 5px;
}
.btn-tabmenu li {
	background: #EFEFEF;
	border-radius: 5px;
}
.btn-tabmenu li a { padding: 20px 0 17px; }
.btn-tabmenu li a:after { display: none; }

.btn-tabmenu .selected:before { display: none; }
.btn-tabmenu .col-4 .col {
	width: calc(25% - 8px);
	margin-left: 10px;
	margin-bottom: 1rem;
}
.btn-tabmenu .col-4 .col:nth-of-type(4n+1) { margin-left: 0; }

@media screen and (max-width: 999px) {
.tab-menu li a {
    font-size: 2.8vw;
}
}

/* テーブル */
table.default,
.table-default { 
	background: #fff;
	overflow: hidden;
}

/* お知らせ */
.news-pic {
    margin-bottom: 1.5rem;
    position: relative;
    width: 96%;
    padding-bottom: 72%;
}
.news-pic img {
	width: auto;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    display: block;
}

#news li .news-head {
    max-width: 295px;
    max-height: 300px;
    width: 20vw;
    height: 20vw;
    background: #6495ED;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
#news li .news-head .cate {
    width: 100%;
    text-align: right;
    padding: 9% 20px 0;
}
#news li .news-head .cate p {
    margin: 0;
    color: #fff;
}


#news .cate-news { border-color: #6cc3cd; }
#news .cate-important { border-color: #BF1919; }
#news .cate-limi { border-color: #BDD694; }
#news .cate-3 { border-color: #EBB9AB; }
#news .cate-4 { border-color: #BFB2A6; }
#news .cate-5 { border-color: #B5A6BF; }
#news .cate-6 { border-color: #92D6B8; }
#news .cate-news .cate { background: #8BD0D9; }
#news .cate-important .cate { background: #BF1919; }
#news .cate-limi .cate { background: #BDD694; }
#news .cate-3 .cate { background: #EBB9AB; }
#news .cate-4 .cate { background: #BFB2A6; }
#news .cate-5 .cate { background: #B5A6BF; }
#news .cate-6 .cate { background: #92D6B8; }
#news li .data {
    color: #345BA0;
    margin-bottom: 1em;
}
#news li .ttl {
    margin-bottom: 0.5rem;
    width: 96%;
}
#news li p.txt {
    width: 96%;
    text-align: justify;
    line-height: 1.8;
    margin: 1em 0;
    letter-spacing: 1.57px;
}
#news .cate-limi {
	position: relative;
}
#news .cate-limi:after {
	position: absolute;
	top: 0;
	right: 0;
	width: 80px;
	height: 80px;
	z-index: 1;
	content: "";
	background: url(../img/label-present.png) no-repeat;
	background-size: contain;
	display: inline-block;
}
#news .cate-news .ttl a { color: #1f848f !important; }
#news .cate-important .ttl a { color: #9e0909 !important; }
#news .cate-limi .ttl a { color: #809e4f !important; }
#news .cate-3 .ttl a { color: #c26d55 !important; }
#news .cate-4 .ttl a { color: #5e5045 !important; }
#news .cate-5 .ttl a { color: #8E779E !important; }
#news .cate-6 .ttl a { color: #549E7E !important; }

/* ない場合 */
#no-have {
	background: #EDEDE8;
    padding: 7rem 1rem;
    border-radius: 5px;
	text-align: center;
	font-weight: bold;
}

/* 別窓ウィンドウ */
/*a[target="_blank"]:after {
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	background: url(../img/common/i-window.png) no-repeat;
	background-size: contain;
	margin-left: 5px;
}*/

/*=========================================
		装飾
=========================================*/ 
#container { 
	position: relative;
	overflow: hidden;
}
#container .pattern { 
	position: absolute;
	z-index: -2;	
}
#container .pattern1 {
	left: 0;
    top: 42rem;
}
#container .pattern2 {
	right: -11rem;
    top: 64rem;
}
#container .pattern3 {
	top: 73rem;
    right: -4rem;
}
#container .pattern4 {
	top: 138rem;
    left: -5rem;
}
#container .pattern5 {
	top: 165rem;
    left: 20rem;
}
#container .pattern6 {
	top: 199rem;
    right: -21rem;
}
#container .pattern7 {
	top: 206rem;
    right: -6rem;
    z-index: -1;
}
#container .pattern8 {
	top: 268rem;
    left: 6rem;
}
#container .pattern9 {
	top: 279rem;
    left: 7%;
}
#container .pattern10 {
	top: 339rem;
    right: -9rem;
}
#container .pattern11 {
	top: 348rem;
    right: 23rem;
}
#container .pattern12 {
	top: 396rem;
    left: -4rem;
}

/*=========================================
		sidemenu
=========================================*/
#sidemenu { 
	width: 200px;
	display: inline-block;
    float: left
}
#sidemenu .selectmenu select { height: 4rem; }
#sidemenu form > div { margin-bottom: 1rem;}
#sidemenu .ttl_wrap h5 {
	background: #BFE1D3;
	text-align: center;
	padding-top: 0.5rem;
}
#sidemenu .ttl_wrap:after {
	content: "";
	width: 100%;
	height: 18px;
	background: url(../img/common/bg-side2.png);
	display: block;
}
#sidemenu input { height: 3.6rem; }
#sidemenu .selectmenu select { padding: 11px 50px 11px 8px; }
#sidemenu .selectmenu input[type="text"] { padding: 11px 25px 11px 10px; }
#sidemenu #side2 li a:hover, #sidemenu #side3 li a:hover {
	opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: “alpha( opacity=100 )”;
    -webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    transition: 0.1s linear;
    background: rgba(0,0,0,.1);
    border-radius: 5px;
}

/* side1 */
#sidemenu #side1, #sidemenu #side4 { 
	padding: 1rem;
	background: #BFE1D3;
	border-radius: 5px;
}
#sidemenu #side1 input {
	width: 100%;
	border-radius: 5px 0 0 5px;
}
#sidemenu #side1 li.btn-search {
	background: #5EBADB;
    width: 36px;
    height: 3.6rem;
    text-align: center;
	border-radius: 0 5px 5px 0;
}
#sidemenu #side1 li.btn-search .img_wrap {
	width: 17.5px;
    display: inline-block;
}
#sidemenu #side1 li.btn-search .img_wrap img { vertical-align: bottom; }
#sidemenu #side1 li.btn-search a { padding: 0; }

/* side2 */
#sidemenu #side2, #sidemenu #side3 {
    background: url(../img/common/bg-side.png);
	padding: 5px;
	border-radius: 5px;
}
#sidemenu #side2 .ttl_wrap, #sidemenu #side2 .cate-list {
	background: #EDEDE8;
}
#sidemenu #side2 .cate-list, #sidemenu #side3 .cate-list {
	border-right: 1px solid #F7F7E4;
    border-left: 1px solid #F7F7E4;
	border-bottom: 1px solid #F7F7E4;
}
#sidemenu #side2 .cate-list li {    
	margin: 0 5px;
	border-bottom: 1px solid #fff;
}
#sidemenu #side2 .cate-list li:last-of-type { border: none; }
#sidemenu #side2 .cate-list li a {
    padding: 5px 5px;
	font-weight: 500;
}
#sidemenu #side2 .cate-list li a span {
    width: 34px;
	height: 34px;
    display: inline-block;
}
#sidemenu #side2 .cate-list li a p {
	padding-left: 4px;
    vertical-align: middle;
    display: inline-block;
	letter-spacing: -0.15rem;
}

/* side3 */
#sidemenu #side3 .ttl_wrap, #sidemenu #side3 .price-list { background: #fff; }
#sidemenu #side3 .single-arrow_r::after { 
	border-left-color: #a8a8a2;
}
#sidemenu #side3 .price-list li {
	margin: 0 5px;
	border-bottom: 1px solid #e8e8e3;
	height: 4.4rem;
}
#sidemenu #side3 .price-list li:last-of-type { border: none; }
#sidemenu #side3 .price-list li a { 
	padding: 5px 5px;
	font-weight: 500;
}
#sidemenu #side3 .price-list p { letter-spacing: -0.07rem; }

/* side4 */
#sidemenu #side4 .btn { margin-top: 0.8rem; }
#sidemenu #side4 .btn a { letter-spacing: 0.1rem; }

/* side5 */
#sidemenu #side5 { 
	padding: 1rem 5px 5px;
	background: #BFE1D3;
	border-radius: 5px;
	text-align: center;
	min-height: 4.4rem;
}
#sidemenu #side5 .slide-parent .img_wrap {
	width: 10px;
	margin-right: 5px;
}
#sidemenu #side5 > ul {
	background: #EDEDE8;
	padding: 5px; 
	margin-top: 1rem;
}
#sidemenu #side5 > ul > li {
	margin-bottom: 5px;
}
#sidemenu #side5 input[type="text"] { width: 100%; }
#sidemenu #side5 .table .td { vertical-align: middle; }
#sidemenu #side5 .btn { margin: 1rem 0 5px; }
#sidemenu #side5 .btn a { letter-spacing: 0.1rem; }
#sidemenu #side5 .slide-parent .img_wrap img { vertical-align: middle; }
#sidemenu #side5 p a { color: #141414 !important; }

/* side6 */
#sidemenu #side6 { 
	background: #EBEBE1;
	padding: 1rem;
}
#sidemenu #side6 li { margin-top: 0.8rem; }
#sidemenu #side6 li img { vertical-align: bottom; }
#sidemenu #side6 li:first-of-type { margin-top: 0; }

/*=========================================
		maincontent
=========================================*/
#maincontent_wrap { margin: 2rem auto 0; }

/*=========================================
		bg-colorfull
=========================================*/
#bg-colorful {
	height: 30rem;
	background: url(../img/common/bg-kasa.jpg) no-repeat;
	width: 100%;
	background-size: cover;
	position: relative;
	overflow: hidden;
}

/*=========================================
		footer
=========================================*/
footer {
}
#info_wrap {
    margin: 0 auto;
    text-align: center;
    padding: 6rem 0;
    background: #F2F2F2;
    overflow: hidden;
}
#info_wrap #info_wrap_inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 1400px;
    width: 90%;
    margin: 50px auto;
}
#info_wrap .contact_block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 48%;
}
#info_wrap .contact_block .img_wrap {
    max-width: 197px;
    width: 30%;
    margin-right: 4%;
}
#info_wrap .contact_block .contact_text {
    width: 66%;
    text-align: left;
}
#info_wrap #info_wrap_inner .foot_company_text {
    max-width: 500px;
    width: 40%;
    text-align: left;
}
#info_wrap .contact_block .contact_text .btn_style01.btn_left {
    margin: 0;
}

#info_wrap #info {
    margin-top: 1rem;
}
footer #footer-menu_wrap {
    margin: 0 auto;
    background: #2E456E;
}
footer #footer-menu_wrap .fm-list_wrap {
    max-width: 1400px;
    width: 90%;
    margin: 6em auto 3em;
}
footer #footer-menu_wrap .fm-list_wrap .img_wrap {
    max-width: 412px;
    width: 70%;
    margin: 0 0 3em;
}
footer #footer-menu_wrap .fm-list_wrap ul.footer-menu {
    width: 100%;
    margin:0;
    padding:0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    padding-bottom: 3em;
    margin-bottom: 3em;
    border-bottom: 1px solid #FFFFFF;
}
footer #footer-menu_wrap .fm-list_wrap ul.footer-menu li {
    margin-right: 2em;
    display: inline-block;
}
footer #footer-menu_wrap .fm-list_wrap ul.footer-menu li a {
    color: #fff;
}
footer #footer-menu_wrap .fm-list_wrap ul.footer-menu li:hover a {
    text-decoration: underline;
}
#copyright { 
	margin-top: 5rem;
    text-align: left;
    padding-bottom: 2rem;
	color: #fff;
}

/* 三角の括弧 */
footer .kagi_wrap { line-height: 1.6rem; }
.kagi {
	width: 8px;
	height: 16px;
}
.kagi-start:before {
	border-top: 8px solid #141414;
	border-right: 8px solid transparent;
}
.kagi-start:after {
	border-bottom: 8px solid #141414;
	border-right: 8px solid transparent;
}
.kagi-end:before {
	border-top: 8px solid #141414;
	border-left: 8px solid transparent;
}
.kagi-end:after {
	border-bottom: 8px solid #141414;
	border-left: 8px solid transparent;
}


/*順番にフェードイン*/
.box{
}
.fadeUp {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}



/*=========================================
		header
=========================================*/
header {
    overflow: hidden;
}
header > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 20px auto;
}
header > div #logo_wrap {
    width: 22%;
    max-width: 265px;
}
header > div #logo_wrap a {
    font-size: 0;
}
header > div #headmenu_wrap ul#headmenu {
    width: 100%;
    margin:0;
    padding:0;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	justify-content: flex-end;
}
header > div #headmenu_wrap ul#headmenu > li {
    width: auto;
    line-height: 1.8;
    margin: 5px 3%;
}
header > div #headmenu_wrap ul#headmenu > li:hover > a {
    text-decoration: underline;
}

header > div #headmenu_wrap ul#headmenu >li.login_list {
    display: block;
    width: 100%;
    margin: 0;
}
header > div #headmenu_wrap ul#headmenu > li.login_list > ul.login_list_inner {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 90%;
}
header > div #headmenu_wrap ul#headmenu > li.login_list > ul.login_list_inner li {
    line-height: 1.8;
    margin: 5px 0;
    padding: 0 3%;
    position: relative;
}
header > div #headmenu_wrap ul#headmenu > li.login_list > ul.login_list_inner li:not(:last-of-type)::after {
    content: "";
    width: 1px;
    height: 70%;
    background: #ccc;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
header > div #headmenu_wrap ul#headmenu > li.login_list > ul.login_list_inner li:hover > a {
    text-decoration: underline;
}

/*=========================================
		footer
=========================================*/
footer .fm-list_wrap .table a { 
	width: auto;
	display: inline-block;
}


/*=========================================
		mediaquery
=========================================*/
@media screen and (min-width: 1800px) {
	#logo_wrap {
		left: 14% !important;
	}
}

/*=========================================
			parts
=========================================*/


@media screen and (min-width: 1000px) {
	
	#news {
    width: 100%;
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#news > li,
#news .col {
    width: calc((100%/3) - 5%);
    max-width: 400px;
    margin: 0 7% 3% 0;
    position: relative;
    padding: 70px 0;
}
#news li:nth-of-type(3n),
#news .col:nth-of-type(3n) {
    margin-right: 0;
}

	/* gnav */
	.gnav_wrap {
		background: url(../img/common/nami2.png) no-repeat;
		background-size: cover;
		position: absolute;
		height: 11rem;
		bottom: 0;
		left: 0;
		width: 100%;
	}
	
	/* パンくずリスト */
	#pan li.visited { background: #CEE3EB; }
	#pan li a:after { border-left: 20px solid #CEE3EB; }
	
	
	/* ボタンタブメニュー */


	
	/*=========================================
			header
	=========================================*/

	#headmenu_wrap {
	}
	#headmenu {
		border-spacing: 2px 0;
	}

	header > div #headmenu_wrap {
    width: 70%;
    max-width: 846px;
}

	/* logo */
	#logo_wrap {
	}
	
	/*=========================================
			maincontent
	=========================================*/
	#maincontent {
		width: 100%;
	}
	#maincontent h1 img:nth-of-type(2),
	#maincontent h1 img:nth-of-type(3),
	#maincontent h1 img:nth-of-type(4) { margin-left: 10px; }
	
	/*=========================================
			footer
	=========================================*/
	footer section ul.table > li.fm-items {
		width: 50%;
	}
	footer #bottom-menu_wrap #bottom-menu {
		display: inline-block;
		float: right;
	}
	footer #footer-menu_wrap a p { font-weight: 500; }
	footer .single-arrow { font-weight: 500; }
}

@media screen and (max-width: 999px) {		
	/*=========================================
			parts
	=========================================*/
	/* パンくず */
	#pan { 
		margin: 0 10px 2rem;
		padding: 0.5rem;
	}
	#pan li { padding-left: 0; }
	#pan li a { padding: 0; }
	#pan li > p { margin: 0 0.7rem; }
	#pan li.visited {
		position: relative;
		display: inline-block;
		padding: 0px 10px;
		vertical-align: middle;
		text-decoration: none;
	}
	#pan li.visited:after {
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		content: "";
		vertical-align: middle;
		right: 0;
		width: 4px;
		height: 4px;
		border-top: 1px solid #141414;
		border-right: 1px solid #141414;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	/* ボタン */
	.btn-movie {
		width: 40px;
		height: 4rem;
	}
	.btn-movie a { padding: 0.9rem !important; }

	/* ハンバーガーメニュー */
	header > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 30px auto;
}
	header > div #headmenu_wrap ul#headmenu {
    display: none;
}
	.nav_btn {
    width: 50px;
    height: 50px;
    border: 2px solid #000;
    border-radius: 50%;
    float: right;
    cursor: pointer;
	position: relative;
}
	.nav_btn span {
    width: 50%;
    height: 3px;
    background: #000;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    transition: 0.5s;
}
	.nav_btn span:first-of-type {
    top: 32%;
}
	.nav_btn span:nth-of-type(2) {
    top: 50%;
}
	.nav_btn span:nth-of-type(3) {
    top: 68%;
}
	header > div #logo_wrap {
    width: 70%;
    max-width: 300px;
}
	.open .img_wrap img {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}
	.open .nav_btn {
    border: 2px solid #fff;
}
	.open .nav_btn span {
    background: #fff;
}
	.open .nav_btn span:first-of-type {
    transform: rotate(-45deg);
    top: 50%;
}
	.open .nav_btn span:nth-of-type(2) {
    transform: rotate(90deg);
    display: none;
}
	.open .nav_btn span:nth-of-type(3) {
    transform: rotate(45deg);
    top: 50%;
}
	.open header {
    overflow: hidden;
    background: #4E75BA;
    /* transition: 0.5s; */
    position: fixed;
    z-index: 101;
    width: 100%;
}
	.open header > div #headmenu_wrap ul#headmenu {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    top: 11%;
    width: 100%;
    padding: 0 5%;
    z-index: 100;
    transition: 0.5s;
    background: #4E75BA;
    height: calc(100vh - 11%);
}
	header > div #headmenu_wrap ul#headmenu > li {
    width: 100%;
    border-bottom: 1px solid #fff;
    padding: 4px 10px 5px;
    margin: 0;
}
	header > div #headmenu_wrap ul#headmenu li a {
    color: #fff;
}
	header > div #headmenu_wrap ul#headmenu >li.login_list {
    border: none;
    margin: 20px 0 0;
    text-align: center;
}
	header > div #headmenu_wrap ul#headmenu > li.login_list > ul.login_list_inner {
    justify-content: center;
}
	
	
	
	/* スマホ用検索 */
	.spsearch input[type="text"] { padding: 7px 8px; }
	.spsearch > ul { padding: 2rem; }
	.spsearch input[type="text"] { width: 100%; }
	.spsearch .table-abs { width: 100%; }
	.spsearch .table-abs li { width: 50%; }
	.spsearch .table-abs li.kara {
		width: 1em;
		padding: 0 10px;
		box-sizing: content-box;
		vertical-align: middle;
	}
	.spsearch .btn_wrap.col-1 {
		margin: 0 auto 3rem;
		width: calc(100% - 40px);
	}
		
	/* 子ページのタイトル */
	
	
	/* ボタンタブメニュー */
	.btn-tabmenu li a { padding: 17px 0 14px; }
	
	/* タイトル */
	#maincontent section .ttlborder span { margin-top: 1rem; }
	
	/*=========================================
			装飾
	=========================================*/
	#container .pattern5 { left: -8%; }
	
	/*=========================================
			maincontent
	=========================================*/
	#maincontent_wrap { margin-top: 2rem; }
	#maincontent h1 img:nth-of-type(2),
	#maincontent h1 img:nth-of-type(3),
	#maincontent h1 img:nth-of-type(4) { margin-top: 5px; }
	
	/*=========================================
			bg-colorful
	=========================================*/	
	#bg-colorful { height: 20rem; }
	
	/*=========================================
			footer
	=========================================*/
	#info_wrap #info_wrap_inner {
    display: block;
}
	#info_wrap .contact_block {
    display: block;
    width: 100%;
    padding: 0;
}
	#info_wrap .contact_block .img_wrap {
    margin: 0 auto 30px;
}
	#info_wrap .contact_block .contact_text {
    width: 100%;
    text-align: left;
}
	#info_wrap #info_wrap_inner .foot_company_text {
    width: 100%;
    margin: 80px 0 0;
}
	#info_wrap .contact_block .contact_text .btn_style01.btn_left > a {
    float: none;
    display: block;
    margin: 0 auto;
}
	footer #footer-menu_wrap .fm-list_wrap ul.footer-menu {
    border-bottom: none;
}
	footer #footer-menu_wrap .fm-list_wrap ul.footer-menu li {
    margin-right: 0;
    width: 100%;
    border-bottom: 1px solid #fff;
	padding: 0;
}
	footer #footer-menu_wrap .fm-list_wrap ul.footer-menu li a {
    padding: 5px 10px;
}
	
	#news li .news-head {
    width: 56vw;
    height: 56vw;
    max-width: 100%;
    max-height: 100%;
}
	.pager_wrap {
    margin-top: 2rem;
}
}

@media screen and (max-width:999px) and (min-width: 481px) {
	/*=========================================
			parts
	=========================================*/
	/* spgmenu */
	#spgmenu .menu_wrap .btn-cart_wrap .txt-cart {
		float: left;
		padding-top: 0.8rem;
		margin: 0 5px;
		width: auto;
	}
	
	/* スマホ用検索 */
	.spsearch ul li { margin-top: 1.5rem; }
	
	/*=========================================
			装飾
	=========================================*/
	#container .sya { width: 50%; }
	#container .sankaku { width: 11%; }
	#container .sankaku.pattern9 { left: -5%; }
	#container .sankaku.pattern11 { right: -5%; }
	
	/*=========================================
			head-menu
	=========================================*/
	#headmenu_wrap { right: 10px; }
	
	/*=========================================
			footer
	=========================================*/
	footer .fm-list_wrap { position: relative; }
	footer #bottom-menu_wrap {
		position: absolute;
		bottom: 0rem;
		right: 0;
		padding-top: 8rem;
		width: 67%;
	}
	footer .navmenu { 
		margin-top: 1rem;
		clear: both;
		overflow: hidden;
	}
	footer #bottom-menu_wrap .fm-txt_wrap li {
		width: calc(33.333% - 40px);
		margin-bottom: 1rem;
	}
}

@media screen and (min-width: 481px) {
	/*=========================================
			parts
	=========================================*/
	/* 子ページのタイトル */
	#pagettl_wrap .border-pagettl {
		width: 429.5px;
		margin: 0 auto;
	}
	
	/*=========================================
			footer
	=========================================*/
	footer section ul.table > li.fm-furusato > ul:first-of-type { margin-bottom: 6rem; }
	footer #bottom-menu_wrap { padding-top: 8rem; }
	footer #bottom-menu_wrap h5 { display: none; }
	footer #bottom-menu_wrap .fm-txt_wrap li {
		display: inline-block;
		float: left;
		margin-right: 40px;
	}
	footer .fm-txt_wrap { margin-top: 1.4rem; }
	footer .single-arrow::before {
		border: 5px solid transparent;
		border-left: 7px solid #141414;
		left: 0;
		top: 10px;
	}
	footer .single-arrow { padding-left: 12px; }
	footer .navmenu { margin-bottom: 5px; }
	footer .navmenu li {
		float: left;
		margin-left: 10px;
		min-width: 5.5em;
	}
	footer .navmenu li:first-of-type { margin-left: 0; }
	footer .navmenu li a { padding: 1.4rem 1.1rem; }
	footer .btn-cart_wrap {
		background: url(../img/common/bg-white.png) repeat;
		box-shadow: 0 3px 1px 0px rgba(0,0,0,.05);
	}
	footer .btn-cart_wrap .txt-cart { width: 9em; }
	footer .btn-cart_wrap p { 
		color: #396e83;
		font-weight: bold !important;
	}
}

@media screen and (max-width: 480px) {
	
	
	#news li .news-head .cate {
    padding: 4vw 2vw 0;
}
	/*=========================================
			parts
	=========================================*/
	/* コンテンツタイトル */
	#maincontent section .ttlborder h2 {
    line-height: 8vw;
    letter-spacing: 0.25vw;
    font-size: 6vw;
}

#maincontent section .main_ttl_block h2 {
    line-height: 8vw;
    letter-spacing: 0.25vw;
    font-size: 10vw;
}

.caution {
    font-size: 3.4vw;
}
	
	/* 子ページのタイトル */
	#pagettl_wrap {
    padding: 14vw 0;
}
#pagettl_wrap h1 {
    font-size: 10.5vw;
}
#pagettl_wrap h1 span {
    font-size: 5.2vw;
    margin: 1vw 0 0;
}
	.middle_ttl01 {
    margin: 15vw auto 5vw;
}
	.middle_ttl01 h2 {
    font-size: 6vw;
    letter-spacing: 0.5vw;
}
	.middle_ttl01 h2 span {
    font-size: 14vw;
    letter-spacing: 0.35vw;
    top: -11vw;
}
	
	/*タブ*/
	.tab-menu {
    margin: 0 auto;
}
	.tab-menu li a {
    font-size: 3vw;
}
	
	/*ステップ*/
	.step {
    padding: 1em 0;
}
	.step ol {
    display: block;
    width: 90%;
}
	.step ol::before {
    display: none;
}
	.step ol.table-abs  li {
    display: block;
    width: 100%;
    text-align: left;
    padding: 1em 0;
}
	.step ol.table-abs li em {
    display: inline-block;
}
	.step ol li em {
    font-size: 2.6vw;
}
	.step li:before {
    margin: 0 10px -7px 0;
}
.step ol li:after {
    width: 2px;
    height: 80%;
    left: 0.75em;
    top: 69%;
}

	
	
	/* spgmenu */
	.nav_btn {
    width: 10vw;
    height: 10vw;
}
	header > div {
    margin: 5vw auto;
}
	.nav_btn span {
    height: 2px;
}
	.open header > div #headmenu_wrap ul#headmenu {
    top: 22vw;
    height: calc(100vh - 22vw);
}
	header > div #headmenu_wrap ul#headmenu li {
    font-size: 3.4vw;
}
	
	
	
	/* ステップ */

	
	/* ボタン */
	#maincontent .btn a { padding: 1.6rem 1.1rem; }
	#maincontent .btn a p.t-14 {
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 2.7rem;
	}
	
	/*=========================================
			装飾
	=========================================*/
	#container .sya { width: 90%; }
	#container .sankaku { 
		width: 20%;
		left: -17%;
	}
	#container .pattern1 {
		left: -10rem;
		top: 42rem;
	}
	#container .pattern3 {
		top: 67rem;
		right: -3rem;
	}
	#container .pattern5 { left: -7rem; }
	#container .pattern7 {
		top: 198rem;
		right: -4rem;
	}
	#container .pattern11 { right: -6em; }
	
	/* spgmenu */
	#spgmenu {
		height: 8rem;
		background-size: cover;
	}
	
	/*=========================================
			bg-colorful
	=========================================*/	
	#bg-colorful { height: 17rem; }
	
	/*=========================================
			footer
	=========================================*/
	footer #footer-menu_wrap { 
		width: 100%;
	}
	#info_wrap {
    padding: 6vw 0;
}
	#info_wrap #info_wrap_inner {
    margin: 5vw auto;
}
	footer #footer-menu_wrap .fm-list_wrap .img_wrap {
    margin: 0 0 6vw;
}
	#info_wrap #info_wrap_inner .foot_company_text {
    margin: 10vw 0 0;
}
	footer #footer-menu_wrap .fm-list_wrap {
    margin: 12vw auto 6vw;
}
}

/*=========================================
		cssハック
=========================================*/
/* IE9〜11 */
@media screen and (min-width: 0\0) and (min-resolution: +72dpi) {
	.link-under { line-height: 1; }
	.btn a { padding: 13px 1.1rem 6px; }
	
	/* サイドメニュー */
	#sidemenu #side2 .cate-list li a p,
	#sidemenu #side3 .price-list p { margin-top: 0.7rem; }	
	#sidemenu #side5 { padding: 17px 5px 0; }
	#side5 p { line-height: 1.4rem; }
	
	/* global-nav */
	#pcgnav nav .nav_wrap li:hover > ul > li a { padding: 2.2rem 0.5rem 1.4rem; }
	
	/* ページャー */
	.pager li p {
		line-height: 1;
		padding: 14px 0 0;
	}
	
	/* パンくず */
	#pan li a, #pan li > p { 
		padding: 1rem 7px 0.4rem;
		line-height: 1.7;
		margin: 0;
	}
		
	/* お知らせ */
	#news .cate p {
		line-height: 1.4rem;
		padding: 7px 0 2px;
	}
	
	/* 子ページタイトル */
	#pagettl_wrap #pagettl {
		width: auto;
		max-width: none;
	}
	
	/* ステップ */
	.step li::before {
		line-height: 1;
		padding: 1rem 0 0;
	}
	
	/* テーブル */
	.remodal_wrap table.default, .remodal_wrap .table-default { border-collapse: separate; }
	
	/* タブメニュー */
	.tab-menu li a { padding: 2.6rem 0 1.7rem; }
	
	/* footer */
	footer .single-arrow::before { top: 0.4rem; }
	footer .navmenu li a { padding: 17px 1.1rem 11px; }
}
/* Edge12〜14 */
@supports (-ms-ime-align: auto) and (not (-webkit-text-stroke: initial)) {
	.link-under { line-height: 1; }
	.btn a { padding: 13px 1.1rem 6px; }
	
	/* サイドメニュー */
	#sidemenu #side2 .cate-list li a p,
	#sidemenu #side3 .price-list p { margin-top: 0.7rem; }
	#sidemenu #side5 { padding: 17px 5px 0; }
	#side5 p { line-height: 1.4rem; }
	
	/* ページャー */
	.pager li p {
		line-height: 1;
		padding: 14px 0 0;
	}
	
	/* パンくず */
	#pan li a, #pan li > p { 
		padding: 1rem 7px 0.4rem;
		line-height: 1.7;
		margin: 0;
	}
	
	/* お知らせ */
	#news .cate p {
		line-height: 1.4rem;
		padding: 7px 0 2px;
	}
	
	/* 子ページタイトル */
	#pagettl_wrap #pagettl {
		width: auto;
		max-width: none;
	}
	
	/* ステップ */
	.step li::before {
		line-height: 1;
		padding: 1rem 0 0;
	}
	
	/* テーブル */
	.remodal_wrap table.default, .remodal_wrap .table-default { border-collapse: separate; }
	
	/* タブメニュー */
	.tab-menu li a { padding: 2.6rem 0 1.7rem; }
	
	/* footer */
	footer .single-arrow::before { top: 0.4rem; }
	footer .navmenu li a { padding: 17px 1.1rem 11px; }
}

@supports (-ms-ime-align:auto) {
	/* 子ページタイトル */
	#pagettl_wrap #pagettl {
		width: auto;
		max-width: none;
	}
}