@charset "utf-8";
/**********************************************************
creation date 2019.07.01
https://www.sevenbank.co.jp/
Copyright (C) Seven Bank,Ltd. All Rights Reserved.
***********************************************************/

/**********************************************************
http://meyerweb.com/eric/tools/css/reset/
	v2.0 | 20110126
	License: none (public domain)
***********************************************************/

/*-------------
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;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	box-sizing: border-box;
	-box-sizing: border-box;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
/*-------------
common
-------------*/
body {
	width: 100%;
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3','ヒラギノ角ゴ W3', Meiryo, "メイリオ", sans-serif;
	color: #535353;
}
body > iframe, body > img {
	display: none;
}
img {
	width: 100%;
	height: auto;
	display: block;
}

.imgAuto {
	width: auto;
	max-width: 100%;
	margin: auto;
}

html {
	min-width: 320px;
	font-size: 10px;
	font-size: calc(3.125vw);
	font-size: -webkit-calc(3.125vw);
}
a {
	color: #0f91ff;
	text-decoration: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0.2);
}
a:hover {
	text-decoration: underline;
}
a img:hover {
	opacity: 0.8;
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

.icon {
	display: inline-block;
	padding-left: 0.3rem;
	width: auto;
	vertical-align: middle;
}
	/* listBlock */
	ul.listBlock01 li::before,
	.listBlock01 ul li::before {
		content: "・";
		color: #ada27e;
	}

/* display */
.pcBlock {
	display: none;
}

/* wrap */
#wrapper {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
}

/* text */
.fBlue {
	color: #978b63 !important;
}
.fRed{
	color: #ff002a !important;
}
.tCenter{
	text-align: center !important;
}
.note{
	padding-top: 0.427rem !important;
	font-size: 1.024rem !important;
	text-indent: -1rem !important;
	padding-left: 1rem !important;
}

/* js */
.js-mouse .js-mouseOver01:hover {
	opacity: 0.8;
}
.js-mouse .js-mouseOver02:hover {
	text-decoration: underline!important;
}

.period{
	padding: 1.792rem 2.987rem 2.987rem;
}
.inner{
	margin: 0 1.28rem 0;
	padding: 2.13rem 1.28rem;
	background: #ffffff;
}
.linkText01 {
	margin-right: 0.171rem;
	padding-right: 0.939rem;
	background: url(/oos/adv/image/tmp_203/icon_004.png) center right no-repeat;
	background-size: 0.768rem auto;
}
.firstInner {
	padding-bottom: 0.5rem;
}

/*-------------
content
-------------*/
#header {
	padding: 3.2% 5.333% 2.4%;
	background-color: #fff;
}
#header .headerInner{
	margin: 0 auto;
	max-width: 1080px;
}
#header .logo {
	float: left;
	width: 34.328%;
}
#header .code {
	float: left;
	width: 37.612%;
	margin: 4.328% 0 0 2.239%;
}

/*-------------
content
-------------*/
.content.beach{
	background-image: url(/oos/adv/image/tmp_203/img_bgline_01.png), url(/oos/adv/image/tmp_203/img_bgline_02.png);
	background-repeat: no-repeat;
	background-position: top center, bottom center;
	-webkit-background-size: 100%;
	background-size: 100%;
	padding: 1.789rem 0 2.625rem;
}
.content .box01 dt {
	margin: 0 auto 1.3rem;
	padding-bottom: 0.8rem;
	background: url(/oos/adv/image/tmp_203/line_001.png) center bottom no-repeat;
	background-size: 50%;
	color: #03306a;
	font-weight: 900;
	font-size: 1.366rem;
	line-height: 2.5rem;
	text-align: center;
}

/*-------------
mv
-------------*/
#mv{
	background: url(/oos/adv/image/tmp_203/img_mvbg.png) center no-repeat;
    background-size: cover;
		box-sizing: border-box;
    width: 100%;
}

#mv img {
	width: 100%;
	max-width: 1418px;
	margin: auto;
}

/*-------------
flow
-------------*/
#flow{
	padding: 2.13rem 2.987rem 0;
}
#flow .box01 {
	margin-top: 50px;
}
#flow .box01List01 li {
	position: relative;
	min-height: 9.131rem;
	margin-top: 10.656%;
	padding: 5.48% 1.639% 5.48% 40.515%;
}
#flow .box01List01 li:first-of-type {
	margin-top: 0;
	background: #efe7ca url(/oos/adv/image/tmp_203/img_002.png) 1.731rem 2.6rem no-repeat;
	background-size: 7.4rem auto;
}
#flow .box01List01 li:nth-of-type(2) {
	background: #efe7ca url(/oos/adv/image/tmp_203/img_003.png) 0.70rem 2.6rem no-repeat;
	background-size: 8.7rem auto;
}
#flow .box01List01 li:nth-of-type(3) {
	background: #efe7ca url(/oos/adv/image/tmp_203/img_004.png) 0.8rem 2.1rem no-repeat;
	background-size: 8.55rem auto;
}
#flow .box01List01 li:before {
	content: "";
	position: absolute;
	top: -1.92rem;
	left: 0;
	right: 0;
	width: 2.048rem;
	margin: 0 auto;
	border-top: 1.109rem solid #ada27e;
	border-left: 1.024rem solid transparent;
	border-right: 1.024rem solid transparent;
	box-sizing: border-box;
}
#flow .box01List01 li:first-of-type:before {
	content: none;
}
#flow .box01List01Elem01 {
	font-weight: bold;
	font-size: 1.024rem;
}
#flow .box01List01Elem01 .big01 {
	font-size: 1.195rem;
}
#flow .box01List01Elem02 {
	margin-top: 0.64rem;
	font-size: 1.11rem;
	font-weight: bold;
	line-height: 1.5;
}
#flow .apply{
	padding: 2.5rem 0;
}
#flow .apply img{
	max-width: 1000px;
	margin: 0 auto;
}

/*-------------
overview, use
-------------*/
#overview,
#use{
	display: inline-block;
	background: #def1ff url(/oos/adv/image/tmp_203/img_bg.png);
}
#use {
	padding-bottom: 2rem;
}

#overview dl dt,
#use dl dt{
	margin-bottom: 0;
	padding: 4px 10px;
	color: #ffffff;
	font-size: 1.28rem;
}
#overview dl dd,
#use p,
#use ul li{
	font-size: 1.11rem;
	font-weight: bold;
	line-height: 1.5;
}

#overview dl dd {
    padding: 1.11rem 0 2.56rem;
}
/*-------------
overview
-------------*/
#overview .line{
	height: 1.789rem;
	background: #ffffff url(/oos/adv/image/tmp_203/line_002.gif) no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
}
#overview .inner{
	margin: 2.13rem 1.28rem 0;
}
#overview dl dt{
	width: 64%;
	background: #978b63;
}
#overview dl dd{
	padding: 1.11rem 0 2.56rem;
}
#overview dl:last-child dd{
	padding-bottom: 0;
	text-indent: -1.11rem;
  padding-left: 1.11rem;
}

/*-------------
use
-------------*/
#use dl{
	margin-bottom: 15px;
	padding: 1.024rem 0.854rem 1.6rem;
}
#use dl.shopBox{
	margin-top: 0.854rem;
	background: #f2f7ff;
}
#use dl.webBox{
	background: #fff7e4;
}
#use dl dt{
	width: 56%;
	margin: 0 0 8px;
	border-radius: 20px;
}
#use dl dt.shop{
	background: #04306a;
}
#use dl dt.web{
	background: #978b63;
}
#use ul{
	margin: 0.854rem 0;
	padding: 0.854rem 1rem;
	background: #efe7ca;
}
#use ul li{
	text-indent: -1.5rem;
	padding-left: 1.5rem;
}
#use ul li span{
	padding-right: 0.342rem;
}
#use .box01 {
	margin-top: 4.478%;
}
#use .box01Elem01 {
	padding: 4.328% 12.687% 0;
	background: #ffa302;
}
#use .box01Elem02 {
	height: 11.264rem;
	padding: 2.985% 4.478%;
	background: #fff;
	font-size: 1.109rem;
	line-height: 1.4;
	text-align: justify;
}
#use .box01Elem02 .text01 {
	display: block;
	margin-top: 5.738%;
}

/*-------------
date
-------------*/

.date .dateText {
	padding: 0.854rem 1.28rem 2.13rem;
	font-size: 1.024rem;
	text-align: right;
}

/*-------------
btnArea
-------------*/
.btnArea{
	margin: 0 auto;
	padding: 1.88rem 0 1.28rem;
	text-align: center;
}
.btnArea .debit{
	padding: 0 3.58rem 1.789rem;
}
.btnArea .apply{
	padding: 0 2.987rem;
}

/*-------------
footer
-------------*/
#footer {
	margin: 0 auto;
	padding-bottom: 1.707rem;
	background-color: #fff;
}
#footer .logo {
	display: block;
	width: 34.8%;
	margin: 0 auto;
}
#footer .copyRight {
	margin-top: 1.707rem;
	font-size: 1.024rem;
	text-align: center;
}
.linkTop,
.linkDebitTop {
	text-align: right;
}
.linkTop {
	margin: 1rem 1.28rem 0;
}
.linkDebitTop {
	margin: 0.854rem 1.28rem 1.28rem ;
}

.linkTop a,
.linkDebitTop a {
	padding-right: 0.853rem;
	background: url(/oos/adv/image/tmp_203/icon_006.png) center right no-repeat;
	background-size: 0.64rem auto;
	font-size: 1rem;
}

/*-------------
pageTop
-------------*/
#pageTop {
	display: none;
	position: fixed;
	bottom: 2.987rem;
	right: 1.707rem;
	width: 12.667%;
}

	#overview{
		padding-bottom: 5rem;
		padding-top: 0;
	}


@media screen and (min-width: 768px) {
	html {
		font-size: calc(1.40350877192982vw);
		font-size: -webkit-calc(1.40350877192982vw);
	}

	/* display */
	.pcBlock {
		display: block;
	}
	.spBlock {
		display: none;
	}
	.period{
		max-width: 1000px;
		margin: 0 auto;
		padding: 4.26rem 2.987rem 5.0rem;
	}
	.inner {
		width: 94.737%;
		padding: 3rem 4.375rem;
	}

	#flow .apply{
		padding: 4rem 0 1.5rem;
	}

	.firstInner {
		padding-top: 0.5rem;
	}
	/* text */
	.note{
		font-size: 1.125rem !important;
	}
	.linkText01 {
		margin-right: 0.125rem;
		padding-right: 1.125rem;
		background-size: 0.938rem auto;
	}

	#header {
		padding: 0;
	}
	#header .logo {
		width: 15.185%;
		margin: 0.833% 0 1.389% 0.833%;
	}
	#header .code {
		width: 16.574%;
		margin: 2.685% 0 0 0.926%;
	}


	/*-------------
	content
	-------------*/
	.contentInner{
		margin: 0 auto;
	}
	.content.beach{
		padding: 5rem 0;
		margin-bottom: 3rem;
	}
	#overview {
    padding-top: 3rem;
	}
	.content .box01 dt {
		margin: 0 auto 3rem;
		background-size: 31%;
		font-size: 1.875rem;
		line-height: 4rem;
	}

	/*-------------
	mv
	-------------*/
	#mv h2 {
		width: 100%;
		margin: 0 auto;
	}

	/*-------------
	flow
	-------------*/
	#flow{
		max-width: 1000px;
		margin: 0 auto;
		margin: 3rem auto;
		padding: 0 2.987rem;
	}
	#flow .box01 {
		margin-top: 3.125rem;
		padding: 3.2% 3.704%;
	}
	#flow .box01.entry {
		padding: 5.1% 4.478%;
	}
	#flow .box01:last-of-type {
		padding-bottom: 4.63%;
	}
	#flow .box01 dt {
		width: 32%;
		font-size: 1.5rem;
		line-height: 2.25rem;
	}
	#flow .box01 dd {
		margin-top: 1.25rem;
		font-size: 1.4rem;
		line-height: 1.875;
	}
	#flow .box01 dd .grantDate {
	font-size: 1.8rem;
}
	#flow .box01 dd ul{
		margin-top: 0.865rem;
	}
	#flow .box01List01 {
		margin-top: 2.5%;
		display: -webkit-flex;
		display: -moz-flex;
		display: flex;
	}
	#flow .box01List01 li:first-of-type {
		margin: 0;
		background-position: 5.0rem 5.2rem;
		background-size: 10.75rem auto;
	}
	#flow .box01List01 li:nth-of-type(2) {
		background-position: 3.5rem 4.7rem;
		background-size: 12.75rem auto;
	}
	#flow .box01List01 li:nth-of-type(3) {
		background-position: 3.5rem 5.0rem;
		background-size: 12.75rem auto;
	}
	#flow .box01List01 li {
		float: left;
		width: 31%;
		height: 19.55rem;
		margin: 0 0 0 3.5%;
		padding: 3% 0 0;
	}
	#flow .box01List01 li:before {
		top: 50%;
		left: -1.75rem;
		right: auto;
		width: 1.375rem;
		margin: -1.25rem 0 0;
		border-top: 1.25rem solid transparent;
		border-bottom: 1.25rem solid transparent;
		border-left: 1.375rem solid #ada27e;
		border-right: none;
	}
	#flow .box01List01Elem01 {
		font-size: 1.5rem;
		text-align: center;
	}
	#flow .box01List01Elem01 .big01 {
		font-size: 1.75rem;
	}
	#flow .box01List01Elem02 {
		margin-top: 9.75rem;
		padding: 0 20px;
		font-size: 1.125rem;
		text-align: center;
	}
	#flow .box01 dd ul li.no01 {
		background: url("/oos/adv/image/tmp_203/no_icon01.png") no-repeat 0 10%;
	}
	#flow .box01 dd ul li.no02 {
		background: url("/oos/adv/image/tmp_203/no_icon02.png") no-repeat 0 10%;
	}
	#flow .box01 dd ul li.no01, #flow .box01 dd ul li.no02 {
		-webkit-background-size: 3.5%;
		background-size: 3.5%;
		padding-left: 4.8%;
	}
	#flow .box01 .btn01 {
		width: 48%;
		margin: 0 auto;
	}
	#flow .box01 .btn02 {
		float: right;
		width: 48%;
		margin-top: 2.5rem;
	}
	#flow .box01 .btnText {
		font-size: 1.375rem;
		line-height: 1;
	}
	#flow .box01 .btnLink {
		height: 6rem;
		margin-top: 0.625rem;
	}
	#flow .box01 .btnLink a {
		border-radius: 0.625rem;
		background-size: 1.375rem auto;
		font-size: 1.625rem;
	}
	#flow .box01 .btn01 .btnLink a {
		box-shadow: inset 0 -0.375rem 0 0 #db4800;
	}
	#flow .box01 .btn02 .btnLink a {
		box-shadow: inset 0 -0.375rem 0 0 #007c29;
		font-size: 1.5rem;
	}
	#flow .box02 {
		margin-top: 2.315%;
		padding: 8.315% 0 0;
		background: url("/oos/adv/image/tmp_203/flow_img01.png") no-repeat 87.5% 0;
		-webkit-background-size: 21%;
		background-size: 21%;
	}
	#flow .box02Elem01 {
		font-size: 1.5rem;
	}
	#flow .box02Elem01 .big01 {
		margin-top: 0.5%;
		font-size: 1.875rem;
	}
	#flow .box02Elem02 {
		margin-top: 2.5%;
		font-size: 1.5rem;
	}

	/*-------------
	overview, use
	-------------*/
	#overview,
	#use{
		display: block;
	}
	#overview.box01 dd,
	#use p,
	#use ul li,
	.date .dateText {
		font-size: 1.313rem;
		line-height: 1.875;
	}

	/*-------------
	overview
	-------------*/
	#overview .inner{
		margin: auto;
	}
	#overview dl dd{
		padding: 1.244rem 0 2.625rem;
	}
	#overview.box01 dd dl dt {
		width: 32%;
		font-size: 1.5rem;
		line-height: 2.25rem;
	}
	#overview.box01 dd .prize{
		font-size: 1.5rem;
	}

	/*-------------
	use
	-------------*/
	#use{
		padding-bottom: 3rem;
	}
	#use dl{
		padding: 1.314rem 1.625rem 1.971rem;
	}
	#use dl dt{
		width: 25%;
		line-height: 1.2;
	}
	#use ul{
		padding: 1.314rem 1.971rem;
	}

	#use .box01 {
		width: 48.426%;
		margin-top: 2.778%;
	}
	#use .box01:nth-of-type(2n + 1) {
		float: left;
	}
	#use .box01:nth-of-type(2n) {
		float: right;
	}
	#use .box01Elem01 {
		padding: 4.971% 9.178% 0;
	}
	#use .box01Elem02 {
		height: 18.125rem;
		padding: 4.78% 7.648%;
		font-size: 1.5rem;
	}
	#use .box01Elem02 .text01 {
		margin-top: 6.692%;
	}

	/*-------------
	date
	-------------*/
	.date{
		width: 95%;
		margin: 0 auto;
	}
	.date .dateText {
		margin: 0 auto;
		padding: 0;
		text-align: right;
	}

	/*-------------
	footer
	-------------*/
	#footer {
		width: 100%;
		margin: 0 auto;
		padding: 0.938rem 0 3.75rem;
	}
	.linkTop {
		margin: 0 1.375rem;
	}
	.linkDebitTop{
		margin: 0.854rem 1.375rem 1.28rem;
	}
	.linkTop a,
	.linkDebitTop a {
		padding-right: 1rem;
		background-size: 0.813rem auto;
		font-size: 1.125rem;
	}
	#footer .logo {
		width: 22.895%;
		max-width: 261px;
	}
	#footer .copyRight {
		margin-top: 1.875rem;
		font-size: 1.125rem;
	}

	/*-------------
	btnArea
	-------------*/
	.btnArea{
		max-width: 999px;
		padding: 5rem 0;
		}
	.btnArea .debit{
		max-width: 590px;
		margin: 0 auto;
		padding: 0 0 5rem;
	}

	#pageTop {
		bottom: 1.875rem;
		right: 1.875rem;
		width: 7.719%;
		max-width: 88px;
	}

	/*-------------
	CPfinish
	-------------*/
	#CPfinish {
		padding: 10px 5px;
	}
	#CPfinish p {
		font-size: 1.5rem;
	}
}

@media screen and (min-width: 1000px){
	.period{
		padding: 4.26rem 0 5.0rem;
	}
	.inner {
		max-width: 1080px;
		margin: 0 auto;
	}
	/* wrap */
	#flow,
	.period{
		width: 94.737%;
	}

	/*-------------
	flow
	-------------*/
	#flow{
		padding: 0;
	}
}


@media screen and (min-width: 1140px) and (max-width:1589px) {
	html {
		font-size: 16px;
	}
	#wrapper {
		background-position: 18%, 82%;
		background-size: 10%;
	}
	#interest{
		background: none;
	}
	.contentInner {
		background-position: 9%, 89%;
		-webkit-background-size: inherit;
		background-size: inherit;
	}
}


@media screen and (min-width: 1152px){
	.date,
	#footer{
		width: 1080px;
	}
}


@media screen and (min-width: 1590px){
	html {
		font-size: 16px;
	}
}