@charset "utf-8";

/*----------------------------------------------------
	petkeycover /  スマホ用CSS
----------------------------------------------------*/
@media screen and (max-width: 736px) {


/* キーカバー */
.petkeycover .proArea {
	margin-top: 80px;
}

.petkeycover .proArea:first-of-type {
	margin-top: 50px;
}

.petkeycover .proArea h4 {
	font-size: 6vw;
}

.petkeycover .proArea ul {
	display: block;
	margin-top: 20px;
	padding: 20px 10px 40px;
}

.petkeycover .proArea.proNseries ul {
	padding: 20px 10px;
}

.petkeycover .proArea ul li {
	width: 100%;
	text-align: center;
	margin-top: 50px;
}

.petkeycover .proArea ul li:first-of-type {
	margin-top: 20px;
}

.petkeycover .proArea ul li img {
	width: 70%;
}

.petkeycover .proArea ul li figure figcaption span {
	font-size: 6.66vw;
}

.petkeycover .proArea dl {
	width: 100%;
	margin-top: 20px;
}

.petkeycover .proArea dl dt {
	font-size: 4.33vw;
	width: 25%;
	padding: 5px;
}

.petkeycover .proArea dl dd {
	font-size: 3.66vw;
	width: 75%;
	padding: 5px;
}




/* キーカバーバナー */
.petkeycover .keyBnr {
	margin-top: 30px;
}

.petkeycover .keyBnr20th,
.petkeycover .keyBnr20th a {
	display: block;
}

.petkeycover .keyBnr20th img {
	width: 100%;
}

.petkeycover .keyBnr ul li,
.petkeycover .keyBnr ul li:nth-of-type(2) {
	width: 100%;
}

.petkeycover .keyBnr ul li img {
	width: 100%;
}


/*----------------------------------------------------
	20周年キャンペーン /  スマホ用CSS
----------------------------------------------------*/
.petkeycover.dog20th .dog20thMain {
	margin: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn {
    width: 100%;
	padding: 0 10px 80px;
}

.petkeycover.dog20th .dog20thMain .dogImage {
	display: none;
}

.petkeycover.dog20th .dog20thMain .topText{
	margin-top: 20px;
}

.petkeycover.dog20th .dog20thMain .dog20thLogo {
	width: 80%;
	margin: 10px auto;
}

.petkeycover.dog20th .dog20thMain .dog20thLogo img{
	width: 27%;
	margin: 10px auto;
}


.petkeycover.dog20th .dog20thMain .dog20thTitle {
	position: relative;
	top: -100px;
	height: clamp(445px, 105vw, 700px);
	max-width: 100%;
	background-image: url(../images/dog_sp.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-bottom: -100px;
	width: 100%;
}

.petkeycover.dog20th .dog20thMain .dog20thTitle .spTitle {
	display: block;
	margin: 0 auto;
	padding-top: clamp(112px, 28vw, 150px);
	width: 45%;
}

.petkeycover.dog20th .dog20thMain .dog20thTitle .pcTitle {
	display: none;
}


.petkeycover.dog20th .dog20thMain .dog20thTitle2 {
	margin: 0;
	background-image: url(../images/footprints_sp.png);
}

.petkeycover.dog20th .dog20thMain .dog20thTitle .border {
	font-feature-settings: "palt";
}
	
.petkeycover.dog20th .ctBeige .ctBeigeIn article {
	margin: 20px auto;
	width: 100%;
	padding-left: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem .frisbeeDog {
	width: clamp(150px, 40vw, 200px);
	top: clamp(-335px, -62vw, -305px);
	left: clamp(1px, 5vw, 200px);
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem .frisbeeDogText {
	width: 42px;
	top: -20px;
	left: -15px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent,
.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem,
.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContentsub {
	display: block;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText1to2 {
	display: block;
	margin-left: 170px;
	margin-right: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText1to2 h4 {
	text-align: center;
	margin-right: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText1to2 .dog20thText1 {
	text-align: center;
	margin-bottom: -5px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText1to2 .dog20thText2 {
	text-align: center;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText1to2 .dog20thText2 img {
	margin-left: -23px;
	width: 35vw;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContent .dog20thText3 {
	margin: 10px auto;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem {
	display: flex;
    flex-flow: column;
	align-items: center;
	padding-left: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem img {
	margin: 20px auto;
	width: 280px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thItem .item3 {
	width: 280px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContentsub {
	padding-left: 0;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContentsub .priceArea {
	margin-left: 10px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContentsub .priceArea p.detail {
	margin-top: 5px;
}

.petkeycover.dog20th .ctBeige .ctBeigeIn article .dog20thContentsub .releaseDate {
	margin: 20px auto 0;
	width: 90%;
	height: auto;
}


/*-------------------スマホ用終了-------------------*/
}

