@charset "UTF-8";

/***************************************************
	collection.css
***************************************************/
#helpguide .headline {
   background: url(/img/collection/main.jpg) center center no-repeat;
    background-size: cover;
	height: 140px!important;
}
#helpguide .pgtp { font-size: 16px; text-align: right; width: 1200px; margin: 5em auto;}
.pgtp a{ 
	background: url(/img/common/arr04.png) 0 5px no-repeat;
    background-size: 14px auto;
	padding-left:  20px;
	-webkit-transition: all .3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.pgtp a:hover {
    background: #fff url(/img/common/arr04.png) 0 0 no-repeat;
    background-size: 14px auto;
    color: #59040b;
}
#helpguide .ttl03 {
    margin-top: -110px;
    margin-bottom: 70px;
    padding-top: 110px;
	font-size: 26px;
}
#helpguide .ttl03 span {
    padding-top: 15px;
    vertical-align: text-top;
}
#helpguide p{
	font-size: 20px; text-align: center; line-height: 2em;
} 
/*--- info01 ---*/
#info01 {
    margin-bottom: 80px;
    padding: 45px 0;
/*    background: url(/img/collection/bg01.jpg) center center no-repeat;
    background-size: cover;*/
    text-align: center;
}

#info01 li {
    font-size: 24px;
	line-height: 2;
}
#info01 li a{ 
	background: url(/img/common/arr08.png) 0 50% no-repeat;
    background-size: 14px auto;
	padding-left:  30px;
	-webkit-transition: all .3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#info01 li a:hover {
    background: #fff url(/img/common/arr08.png) 7px 50% no-repeat;
    background-size: 14px auto;
    color: #59040b;
}
/*--- info02 ---*/
#info02 .btn01 { margin-top: 3em;}

/*--- info03 ---*/
#info03 .d-m-flex {    justify-content: space-between;}
#info03 .imgBox {    width: 33%;}
#info03 .item img {    width: 100%;}
#info03 .txtBox {
	width: 64%;
    margin-left: auto;
    margin-bottom: 90px;
	line-height: 2.1em;
	font-size: 20px;
}
/*--- info04 ---*/
#info04  { }
#info04  a {
    font-size: 40px;
	-webkit-transition: all .3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#info04 a:hover {
    opacity: .8;
    text-decoration: none;
}

/*--- info05 ---*/

#info05  {}
#info05 table { width: 60%; margin: 4em auto;}
#info05 th { font-size: 14px; background-color: #8f8f98; color: #ffffff; padding: 10px; font-weight: normal; border-right: 1px solid #ffffff;}
#info05 td { padding: 0.5em 1em; border: 1px solid #8f8f98;}

/*--- info08 ---*/
#info08 ul { list-style:decimal; font-size: 20px; line-height: 2em; margin-left: 40%;}
#info08 .ttl05 {  width: 50%; margin: -110px auto 2em; padding-top: 110px;}
#info08 .ttl05 span { display: block; text-align: center;  color: #59040b; border: 1px solid #59040b; padding: 0.5em;}
#info08 table { width: 60%; margin: 4em auto;}
#info08 th { font-size: 14px; background-color: #8f8f98; color: #ffffff; padding: 10px; font-weight: normal; border-right: 1px solid #ffffff;}
#info08 td { padding: 0.5em 1em; border: 1px solid #8f8f98;}

/*--- info10 ---*/
#info10 .btn01 { margin-bottom: 3em;}

/*--- info11 ---*/
#info11  a {
    font-weight: bold;
    text-decoration: underline;
	-webkit-transition: all .3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#info11  a:hover {
    opacity: .8;
    text-decoration: none;
}

/*--- info13 ---*/
#info13  a {
    font-weight: bold;
    text-decoration: underline;
	-webkit-transition: all .3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#info13  a:hover {
    opacity: .8;
    text-decoration: none;
}
/*--- info14 ---*/
#info14 table { width: 70%; margin: 4em auto;}
#info14 th { font-size: 14px; background-color: #8f8f98; color: #ffffff; padding: 10px; font-weight: normal; border-bottom: 1px solid #ffffff;}
#info14 td { padding: 0.5em 1em; border: 1px solid #8f8f98;}

@media only screen and (max-width: 768px) {
	#helpguide .ttl03 {
        margin-top: -70px;
        margin-bottom: 1.5em;
        padding-top: 70px;
    }
	#helpguide .pgtp { width: 98%; text-align: center; margin: 3em auto;}
	#helpguide p{
	font-size: 20px; text-align: left; line-height: 2em;
} 
	/*--- info03 ---*/
#info03 dt {
	padding: 0.5em;
	margin-bottom: 0.5em;
	text-align: center;
	font-size: 24px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	color: #8f8f98;
	border: 2px solid #8f8f98;
	border-radius: 6px;
}
#info03 dt.n01{
	background: url(/img/helpguide/ico_step01.png) 8% 50% no-repeat;
    background-size: 80px auto;
}
#info03 dt.n02{
	background: url(/img/helpguide/ico_step02.png) 8% 50% no-repeat;
    background-size: 30px auto;
}
#info03 dt.n03{
	background: url(/img/helpguide/ico_step03.png) 10% 50% no-repeat;
    background-size: 40px auto;
}
	
#info03 dd {
	background: url(/img/helpguide/ico_step00.png) 50% 100% no-repeat;
    background-size: 25px auto;
	padding-bottom: 2em;
	margin-bottom: 1em;
}

#info05 table,#info08 table,#info13 table { width: 100%;}
#info08 ul { margin-left: 20%;}
#info08 .ttl05 {  width: 98%; }
#info14 table { width: 100%;}

}