@charset "UTF-8";

/*================================================
 *  一般・共通設定
 ================================================*/
.wf-notosansjapanese {
    font-family: "Noto Sans JP";
}

body {
    width: 100%;
    margin: 0 auto;
    font-size: 1.2rem;
    font-weight: 600;
    color: #5d5d5d;
    font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    line-height: 1.6;
    letter-spacing: 0px;
    -webkit-text-size-adjust: 100%;
    margin-bottom: 100px;
}

a {
    color: #685548;
    text-decoration: none;
}

a:hover {
    color: #e78f00;
}

a:hover img {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
}

hr {
    content: ".";
    display: block;
    border: none;
    height: 0;
    margin: 0;
    clear: both;
}

p {
    margin: 0 0 1em 0;
}

img {
    vertical-align: middle;
    width: 100%;
}

em {
    font-weight: bold;
}

strong {
    font-weight: bold;
    font-size: 110%;
}

pre {
    margin: 1em 0;
    padding: 1em;
}

.att {
    padding-left: 1.5em;
    text-indent: -1.5em;
}




/*================================================
 *  ヘッダー
 ================================================*/
header {
    width: 100%;
    background-color: #fff;
    background-size: contain;
    top: 0;
	margin-top: 5px;
}

header img {
    width: 100%;
}

.header {
    max-width: 960px;
    background: #fff;
    background-size: cover;
}

.headbox {
    width: 48%;
    float: left;
	max-width: 440px;
}

.header ul {
    width: 49%;
    padding: 0 0;
	float: right;
}

.header ul li {
    max-width: 400px;
    padding-left: 2%;
    padding-top: 4%;
}

main {
    width: 100%;
    overflow: hidden;
}

nav {
    background: url("../images/gnav_bg.jpg") repeat-x;
}

nav ul {
    max-width: 960px;
    margin: 0 auto;
}

nav ul li {
    width: 16.6%;
    float: left;
}

/*================================================
 *  フッター
 ================================================*/
.footbox {
    width: 100%;
    text-align: center;
}

.footbox ul {
    font-size: .7rem;
}

.footbox ul li {
    text-align: center;
    width: 50%;
    float: left;
    padding: .8rem 0 0;
}

.footbox ul li a {
    color: #fff;

}

.footcont {
    max-width: 950px;
    margin: 0 auto;
}


.copyright {
    clear: both;
    padding: 1rem 0 0;
    font-size: 1rem;
    text-align: center;
    color: #ffffff;
}



footer {
    width: 100%;
    position: fixed;
    background: none;
    background-size: cover;
    bottom: 0;
    z-index: 9999;
}

.drawer-open footer {
    position: static;
}


footer img {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
}

#footerbox {
    margin: 0 auto;
    max-width: 960px;
}

.cb-footer {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    display: none;
    background: #ffffff;
    background: rgba(255, 255, 255, 0.5);
}



/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
    position: fixed;
    bottom: 15px;
    right: 15px;
}

.totop a {
    display: block;
    text-decoration: none;
}

.totop img {}

.totop img:hover {}

.headbtn {
    margin: 0 auto;
    max-width: 700px;
    width: 100%;
}

.headbtn img {
    width: 50%;
    padding: 0 0 1% 0;
    float: left;
}

.headbtn-message {
    border: 1px solid #dd3226;
    letter-spacing: 0.1em;
    padding: min(1%, 5px);
    background: rgba(255, 255, 255, 0.9);
    /*background: #fff;*/
    color: #000;
    text-align: center;
    margin: 0;
    font-size: min(3vw, 1.2rem);
}

.headbtn-message strong {
    color: #dd3226;
}

/*================================================
 *  トップページ
 ================================================*/
h1,
.header,
.mainbox,
.title,
.subbox,
.infobox1,
.infobox2,
.cont01box,
.cont02box,
.cont03box,
.cont04box,
.cont05box,
.cont06box,
.cont07box,
.cont08box,
.cont09box,
.cont10box,
.cont11box,
.footbox,
.slide {
    margin: 0 auto;
    max-width: 960px;
    position: relative;
    overflow: hidden;
    width: 100%;
}

h1 {
    font-size: .8rem;
    color: #707070;
}

.mainimg {
    background: #fff;
}

.subwrap {
    background: url("../images/subimg_bg.jpg") repeat-x;
}

.subbox {
    padding-top: 0rem;
}

.subimg {
    background: #e6e6e6;
}

.subimg2 {
    background: #ffffff;
}

.subbox .subbox_top {
    background: url("../images/info_bg01.png") no-repeat;
    background-size: 100%;
}

.subbox .subbox_top img {
    width: 73%;
    max-width: 714px;
    padding: 21% 0 1% 3%;
}

.subbox .subbox_under {
    background: url("../images/info_bg02.png") no-repeat;
    background-size: 100%;
}

.subbox_under2 {
    background: url("../images/cont02_new04.png") no-repeat;
	background-size: 100%;
}

.subbox_info img {
    display: block;
    width: 98%;
    margin: 0 auto;
    padding-bottom: 0.7rem;
}

.subbox_info img:last-child {
    display: block;
    width: 98%;
    margin: 0 auto;
}

.subbox ul {
    margin-left: 3%;
    padding-bottom: 15%;
}

.subbox ul li {
    float: none;
    width: 96%;
    padding: 0 0;
}

.infobox1 {
    background-image: url("../images/info01_bg.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 1rem;
}

.infobtn {
    width: 80%;
    padding: 27% 11% 20%;
}

.infobtn a {}

.bnrbox,
.bnrbox2 {
    padding: 2% 0 6%;
}

img.move {
    animation: anime1 0.5s ease 0s infinite alternate;
    transform-origin: center;
}

@keyframes anime1 {
    from {
        transform: scale(1.06, 1.06);
    }

    to {
        transform: scale(1, 1);
    }
}

.title1,
.cont02 {
    background: #00c00e;
}

.title2,
.cont03 {
    background: #ffffff;
}

.title3,
.cont04 {
    background: #aed5a5;
}

.title4,
.cont05 {
    background: #ffffff;
}

.title5 {
    background: #008009;
}

.cont06 {
    background: #fffee6;
}

.title7 {
    background: #2f6fff;
}

.cont07 {
    background-size: auto auto;
    background-color: rgba(244, 244, 244, 1);
    background-image: repeating-linear-gradient(45deg, transparent, transparent 4px, rgba(234, 234, 234, 1) 4px, rgba(234, 234, 234, 1) 5px);
}

.cont08 {
    background: #e0e0e0;
}

.title8 {
    background: #008009;
}

.cont09 {
    background: #ffffff;
}

.cont11box {
    max-width: 960px;
    width: 90%;
    margin: 0 auto;
    font-size: 0.8rem;
}

.cont11box h2 {
    border-bottom: 4px solid #00c00e;
    font-size: 1rem;
    margin-top: 1.6rem;
    padding-bottom: .1rem;
    margin-bottom: .4rem;
}

.cont11box .textbox {
    border: none;
    padding: 0 0;
    margin: .4rem;
}

.subtitle {
    background: #ffea3d;
}

.titlewrap img {
    display: block;
    margin: 0 auto;
    max-width: 960px;
    position: relative;
    overflow: hidden;
    width: 100%;
}

.cont05 {
    padding: 3%;
}

.footlink {
    background: #00c00e;
}

.footlink ul {
    max-width: 960px;
    margin: 0 auto;
    padding: 1rem 1rem;
}

.footlink ul li {
    float: none;
    width: 80%;
    margin: 0 auto;
    font-size: 0.8rem;
    text-align: center;
    padding: .8rem 0;
    border-bottom: 1px solid #fff;
}

.footlink ul li a {
    color: #fff;
}

.footlink ul li a:hover {
    color: #ff7e00;
}

.mainbnr {
    position: absolute;
    bottom: 3%;
    width: 100%;
}

.mainbox ul li {
    float: left;
    padding: 0 .2%;
    width: 19%;
}

.mainbox {
    background-image: url("../images/main_bg.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
}

.main_top .leftwrap {
    width: 100%;
    float: none;
}

.main_top .leftwrap img {
    padding: 0 0;
}

.main_top .leftwrap img:last-child {
    width: 75%;
	padding-top: 2%;
}

.main_top .rightwrap {
    padding-top: 0;
    width: 55%;
    float: none;
}

.main_under {}

.main_under .leftwrap {
    width: 75%;
    float: none;
    padding-top: 0;
}

.main_under .rightwrap {
    padding-top: 0rem;
    width: 100%;
    margin: -0.4rem auto 0;
    float: none;
}

.infobox1 {
    margin-bottom: 1.5rem;
}

.infobox2 {
    margin-bottom: 1.5rem;
}

.cont02box {}

.cont02box ul {}

.cont02box ul li {
    width: 46%;
    padding: 2%;
    float: left;
}

.subbox_under2 ul {
	margin-left: 0%;
	padding-top: 43%;
	padding-bottom: 7%;
}

.subbox_under2 ul li {
    width: 94%;
    padding: 1% 3%;
    float: none;
}

.cont03box {}

.cont03box ul {}

.cont03box ul li {
    width: 46%;
    padding: 2%;
    float: left;
}

.cont05box {}

.cont05box dl {
    border: 7px solid #ff5400;
    border-radius: 25px;
    padding: 1rem;
}

.cont05box dl dt {
    border-bottom: 5px solid #ff5400;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

.cont05box dl dd {
    padding: 0 1rem;
    font-size: 2rem;
}

.cont05box dl dd .lefticon {
    width: 20%;
    float: left;
    margin-right: 2%;
}

.cont05box p strong {
    background: linear-gradient(transparent 40%, #faff75 60%);
    line-height: 1;
}

.cont05box .step-thumbnail {
    width: 100%;
    padding: 1px;
    border: 1px solid #eee;
    display: inline-block;
    font-size: 0;
}

.cont05box .step-thumbnail img {
    width: 100%;
}

.cont06box {}

.cont06box ul {}

.cont06box ul li {
    width: 100%;
    padding: 0 0;
    float: none;
}

.cont07box {
    padding-bottom: 1rem;
}

.cont07box ul {}

.cont07box ul li {
    width: 46%;
    padding: 2%;
    float: left;
}

.cont08box {
    padding-bottom: 1rem;
}

.cont08box ul {}

.cont08box ul li {
    width: 92%;
    padding: 3% 5% 3% 3%;
}

.cont10box {}

.cont10box table {
    width: 94%;
    margin: 0 auto;
}

.cont10box table tr {
    border-bottom: .8rem solid #ffffff;
}

.cont10box table tr th {
    background: #ff7e00;
    color: #ffffff;
    padding: 2rem 1rem;
    vertical-align: middle;
}

.cont10box table tr td {
    padding: 2rem 1rem;

    vertical-align: middle;
}

.slide {
    border: 5px solid #ccc;
    height: 400px;
    overflow: scroll;
    margin-bottom: 3rem !important;
}

.slide .textbox {
    border: none !important;
}

.mt1 {
    padding-top: .8rem;
}

.mt2 {
    margin-top: 16%;
}

.mb1 {
    margin-bottom: 50%;
}

.mb2 {
    margin-bottom: 6%;
}

.mb3 {
    margin-bottom: 4%;
}


.qawrap {
    background: #ffffff;
    padding: 1% 1% 0;
    display: flex;
}

.qabox {
    margin: 3% 1%;
    padding: 3%;
    background: #fff;
    border-radius: 25px;
    border: 8px solid #4f86f4;
    float: left;
    width: 40%;
}

.balloon1 {
    color: #2f6fff;
    font-size: 2rem;
    padding: 1% 0 0;
    border-bottom: 5px solid #d0d0d0;
}

.balloon1 .lefticon,
.balloon2 .lefticon {
    width: 25%;
    float: left;
    margin-right: 3%;
    padding-bottom: 2%;
}

.balloon1 p {
    width: 100%;
    font-size: 1.4rem;
    margin-top: 1rem;
    line-height: 1.4;
    font-weight: 800;
}

.balloon2 {
    color: #5c5951;
    margin-top: 1.4rem;
    font-size: 1.4rem;
}

.balloon2 p {
    float: left;
    width: 72%;
    line-height: 1.8;
    color: #4a4a4a;
    margin-bottom: 0;
    font-weight: 300;
}

.commonbox {
    font-size: 1rem;
    color: #4a4a4a;
}

.commonbox dl {
    margin-bottom: 40px;
    padding: 0 0;
}

.commonbox dt,
.commonbox h2 {
    padding: .5rem 1rem;
    border-bottom: 2px solid #ffea3d;
    border-radius: 15px;
    color: #fff;
    background: #ffb04a;
}

.commonbox dd {
    padding-top: 10px;
    font-size: 1.1rem;
}

.commonbox ul {}

.commonbox ul li {
    padding: 1rem .5rem;
    border-bottom: 1px solid #ddd;
}

.pc {
    display: block !important;
}

.sp {
    display: none !important;
}

@media screen and (max-width: 480px) {
    .pc {
        display: none !important;
    }

    .sp {
        display: block !important;
    }

    .cont05box dl {
        border: 4px solid #2f6fff;
		border-radius: 0;
		background: #d4e5ff;
        padding: 0 0;
    }

    .cont05box dl dt {
        border-bottom: 3px solid #2f6fff;
        padding-bottom: 0.1rem;
        margin-bottom: 1rem;
    }

    .cont05box dl dd {
        padding: 0 .5rem;
        font-size: 1.2rem;
		color: #2f6fff;
    }

    .cont05box dl dd .lefticon {
        width: 30%;
        float: left;
        margin-right: 2%;
    }

    .qawrap {
        background: #ffffff;
        padding: 1% 1% 0;
        width: 98%;
        display: block;
    }

    .qabox {
        padding: 3% 4%;
    }

    .qabox {
        margin: 3% 1%;
        padding: 3%;
        border-radius: 3px;
        border: 4px solid #2f6fff;
        float: none;
        width: 90%;
		background: #fffef0;
    }

    .balloon1 {
        font-size: .9rem;
        padding: 1% 0 0;
        border-bottom: 3px solid #d0d0d0;
    }

    .balloon1 .lefticon,
    .balloon2 .lefticon {
        width: 15%;
        float: left;
        margin-right: 3%;
        padding-top: 2%;
    }

    .balloon1 p {
        float: left;
        width: 82%;
        font-size: 1.2rem;
        margin-top: 3px;
        line-height: 1.4;
        font-weight: 800;
    }

    .balloon2 {
        color: #5c5951;
        margin-top: 1.4rem;
        font-size: .9rem;
    }

    .balloon2 p {
        float: left;
        width: 82%;
        line-height: 1.8;
        color: #4a4a4a;
        margin-bottom: 0;
        font-weight: 300;
		font-size: 1rem;
    }

    body {
        margin-bottom: 60px;
    }

    .headbox h1 {
        font-size: 1.2rem;
    }

    .cont10box table tr th {
        padding: 1rem 0.5rem;
        font-size: 1rem;
    }

    .cont10box table tr td {
        padding: 1rem 0.5rem;
        font-size: 1rem;
    }

    .cont10box table tr {
        border-bottom: .4rem solid #ffffff;
    }

    .copyright {
        font-size: 1rem;
    }

}

@media screen and (min-width: 481px) {
    .pc {
        display: block !important;
    }

    .sp {
        display: none !important;
    }

    .header {
        background-size: 50%;
        background-position: left;
        background-repeat: no-repeat;
    }
	
	.subbox {
		padding-top: 1.5rem;
	}
	
    .subbox .subbox_top {
        background: url("../images/info_bg01pc.png") no-repeat;
        background-size: 100%;
    }

    .subbox .subbox_under {
        background: url("../images/info_bg02pc.png") no-repeat;
        background-size: 100%;
    }
	
	.subbox_under2 {
		background: url("../images/cont02_new04pc.png") no-repeat;
		background-size: 100%;
	}
	
    .subbox .subbox_top img {
        width: 65%;
        max-width: 714px;
        padding: 15.6% 0 0 3%;
    }

    .subbox ul {
        margin-left: 3%;
        padding-bottom: 26%;
    }

    .subbox ul li {
        float: left;
        width: 48.5%;
        padding: 0 0;
    }

    .subbox_info img {
        padding-bottom: 1.5rem;
    }

    .subbox_info img:last-child {
        display: block;
        width: 80%;
        margin: 0 auto;
    }

    .infobox1 {
        background-image: url("../images/info01_bg_pc.jpg");
        background-size: 100%;
        background-repeat: no-repeat;
        margin-top: 1rem;
    }

    .infobtn {
        width: 100%;
        padding: 26% 8.5% 24%;
    }

    .infobtn a {
        width: 42%;
        float: left;
    }

    .cont02box ul li {
        width: 29%;
    }
	
	.subbox_under2 ul {
        margin-left: 3%;
        padding-top: 43%;
		padding-bottom: 9%;
    }

    .subbox_under2 ul li {
        float: left;
        width: 48.5%;
        padding: 0 0;
    }

    .title2 {
        max-width: 960px;
        margin: 0 auto;
    }

    .title2 img {
        width: 70%;
        max-width: 600px;
        margin-left: 0;
        margin: 0 auto;
    }

    .cont03box ul li {
        width: 23%;
        padding: 1%;
    }

    .bnrbox {
        width: 70%;
        margin: .5rem auto 1.5rem;
        padding: 0 0;
    }

    .bnrbox2 {
		margin-top: 2rem;
        width: 100%;
        padding: 0 0;
		background: #ff5f11;
    }

    .bnrbox2 img {
		display: block;
		max-width: 800px;
        width: 100%;
        margin: 0 auto;
    }

    .title1 img,
    .title3 img,
    .title4 img {
        padding-top: 1rem;

    }

    .title1 img,
    .title3 img,
    .title4 img,
    .title5 img,
    .title6 img,
    .title7 img,
    .title8 img,
    .title9 img {
        width: 50%;
        margin: 0 auto;
    }
	
	.w500 {
		display: block;
		width: 60%;
		margin: 0 auto;
	}

    .cont04box ul li {
        width: 50%;
        float: left;
    }

    .cont04box ul li:last-child {
        width: 50%;
        float: none;
        margin: 0 auto;
    }

    .cont07box ul li {
        width: 23%;
        padding: 1%;
        float: left;
    }

    .cont08box ul li {
        width: 48%;
        padding: 3% 1% 3% 1%;
        float: left;
    }

	.cont06box {
		width: 60%;
		margin: 0 auto;
		padding-bottom: 2rem;
	}

    .cont05box dl {
        border: 6px solid #2f6fff;
        box-sizing: border-box;
		background: #d4e5ff;
        border-radius: 3px;
        padding: 0.5%;
        width: 80%;
        margin: 1rem auto;
    }

    .cont05box dl dt {
        border-bottom: 4px solid #2f6fff;
        padding: 1rem 0;
        margin-bottom: 1rem;
    }

    .cont05box dl dt img {
        width: 60%;
    }

    .cont05box .arr {
        display: block;
        width: 50%;
        margin: 0 auto;
    }

    .cont05box dl dd {
        padding: 0 1rem;
        font-size: 1.5rem;
		color: #2f6fff;
    }

    .cont05box dl dd .lefticon {
        width: 20%;
        float: left;
        margin-right: 2%;
        margin-bottom: .5rem;
    }
	
	.cont05box dl dd p {
		
		margin-bottom: 0;
	}

    .qabox {
        margin: 3% 2% 0;
        padding: 2%;
        background: #fffef0;
        border-radius: 15px;
        border: 6px solid #2f6fff;
        box-sizing: border-box;
        width: 48%;
    }

    .balloon1 {
        font-size: .9rem;
        padding: 1% 0 0;
        border-bottom: 5px solid #d0d0d0;
    }

    .balloon1 .lefticon,
    .balloon2 .lefticon {
        width: 20%;
        margin-right: 3%;
        padding-bottom: 2%;
    }

    .balloon1 p {
        width: 100%;
        font-size: .9rem;
        margin-top: 1rem;
        line-height: 1.4;
        font-weight: 800;
    }

    .balloon2 {
        color: #5c5951;
        margin-top: 1.4rem;
        font-size: .9rem;
    }

    .balloon2 p {
        float: left;
        width: 72%;
        line-height: 1.8;
        color: #4a4a4a;
        margin-bottom: 0;
        font-weight: 300;
    }

    .cont10box table {
        width: 64%;
        margin: 0 auto;
    }

    .footlink ul li {
        float: left;
        width: 100%;
        font-size: 1rem;
        text-align: center;
    }

    .cont11box {
        max-width: 960px;
        width: 70%;
        margin: 0 auto;
        font-size: 1rem;
    }

    .cont11box .textbox {
        border: 1px solid #666;
        padding: 0 2rem 0 2rem;
        margin: 1.4rem;
    }

}