@charset "utf-8";

/*+++++++++++++++++++++++++++++++++++++

  SAVE THE DOG PROJECT #SAVEtheDOG
  
+++++++++++++++++++++++++++++++++++++*/

body{
	background-color:#fafafa;
	font-family: "Noto Sans JP","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","Yu Gothic","游ゴシック","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
}

#SAVEtheDOG{
	width:929px;
	margin:0 auto 50px;
	background-color:#fafafa;
	color:#000;
}

/*--------------------------
  共通
--------------------------*/
#SAVEtheDOG > img{
	width:100%;
}


/*--------------------------
  大枠レイアウト
--------------------------*/
.cont{
	width:100%;
	overflow:hidden;
	margin:30px auto 0;
	display:table;
}


/*--------------------------
  背景ピンク
--------------------------*/
.cont .bc_pink{
	width:51.5%;
	display:table-cell;
	box-sizing:border-box;
	text-align:center;
	background-color:#FAD0C4;
	vertical-align:bottom;
}
.bc_pink .catch{
	font-size:36px;
	font-weight:bold;
	line-height:1.5em;
	text-align:left;
	display:inline-block;
	margin:50px auto;
}
.bc_pink .catch span{
	font-size:16px;
	line-height:1.5em;
	margin-top: 20px;
	display: inline-block;
}


/*--------------------------
  背景ホワイト
--------------------------*/
.cont .bc_white{
	width:48.5%;
	display:table-cell;
	box-sizing:border-box;
	text-align:center;
	background-color:#fff;
	vertical-align:middle;
	padding:50px 0;
}
.bc_white .inner_sdp{
	display: inline-block;
	width:80%;
	margin:0 auto;
	text-align:left;
}
.bc_white .title_sdp{
	margin:0 auto;
	font-size:28px;
	font-weight:bold;
	text-align:left;
	background: linear-gradient(transparent 50%, yellow 50%);
	display:inline;
	line-height:1.5em;
}
.bc_white .text_sdp{
	width:100%;
	margin:30px auto 10px;
	text-align:left;
	line-height:1.4em;
	font-size:15px;
}

/*-1つめイラスト部分-*/
.no1 .no1-img{
	width:80%;
}

/*-2つめイラスト部分-*/
.no2_img{
	width:100%;
	margin:30px auto 0;
	overflow:hidden;
}
.no2_img .no2_text{
	float:left;
	text-align:left;
	width: 40%;
}
.no2_img .no2_text .no2_title{
	margin:0 auto;
	font-size:12px;
	font-weight:bold;
	line-height:1.2em;
}
.no2_img .no2_sent{
	margin:5px auto 0;
	font-size:11px;
	padding-right:10px;
	line-height:1.2em;
}
.no2_img .no2_logo{
	float:right;
	width:60%;
}
.no2_img .no2_logo img{
	width:100%;
}

/*-3つめイラスト部分-*/
.no3_img{
	width:100%;
	margin:0 auto;
	text-align:center;
	overflow:hidden;
}
.no3_img dl{
	margin:15px auto 0;
}
.no3_img dt{
	width:100%;
	box-sizing:border-box;
	border:2px solid #D8D1CD;
	border-radius: 100px;
	padding:5px 0;
	font-size:16px;
}
.no3_img dd{
	margin:5px auto 0;
	font-size:14px;
	text-align:left;
	padding:0 10px;
	line-height:1.3em;
}
/*URLとQRコード*/
.kihu_url{
	margin:0 auto;
	overflow:hidden;
}
.kihu_url .url{
	padding:5px 5px 5px 0;
	float:left;
	border-right:1px solid #999;
	width:58%;
	line-height:1.5em;
	box-sizing:border-box;
}
.kihu_url .url a{
	font-size:12px;
	text-decoration:none;
}
.kihu_url .qrcoad{
	padding:5px 0 5px 10px;
	float:left;
	width:22%;
	line-height:1.5em;
	font-size:13px;
	box-sizing:border-box;
}
.kihu_url img.QRcoad{
	width:18%;
	float:right;
	margin-top:17px;
}
/*マージン調整*/
.no3 .bc_pink .catch{
	margin-bottom:80px;
	line-height:1.7em;
}
.no3 .bc_white{
	padding-bottom:3px;
}
.no3 .bc_white .text_sdp{
	margin:20px auto 0;
}


@media screen and (max-width: 768px){
	
#SAVEtheDOG{
	width: 100%;
	margin: 20px auto 30px;
}
/*--------------------------
  大枠レイアウト
--------------------------*/
.cont{
	margin:25px auto 0;
	display:block;
}
/*--------------------------
  背景ピンク
--------------------------*/
.cont .bc_pink{
	width: 100%;
	display: block;
	padding-top:50px;
}
.bc_pink .catch{
	font-size: 25px;
	margin: 0 auto 30px;
	
}
.bc_pink .catch span{
	font-size: 12px;
	margin-top: 10px;
}
/*--------------------------
  背景ホワイト
--------------------------*/
.cont .bc_white{
	width: 100%;
	display: block;
	padding: 40px 0;
	margin-top:15px;
}
.bc_white .inner_sdp{
	width: 90%;
}
.bc_white .title_sdp{
	font-size: 20px;
}
.bc_white .text_sdp{
	margin: 20px auto 5px;
	font-size: 14px;
	line-height: 1.5em;
}
/*-1つめイラスト部分-*/
.no1 .inner_sdp img{
	max-width:500px;
	margin:0 auto;
}
/*-2つめイラスト部分-*/
.no2_img{
	max-width:360px;
}
.no2_img .no2_text .no2_title{
	font-size: 10px;
}
.no2_img .no2_sent{
	font-size:8px;
}
/*-3つめイラスト部分-*/
.kihu_url{
	max-width:400px;
}
/*URLとQRコード*/
.kihu_url .url{
	font-size:12px;
}
.kihu_url .qrcoad{
	font-size:12px;
	width:auto;
	margin-right:10px;
}
.kihu_url img.QRcoad{
	max-width:55px;
	float:left;
}
.no3_img > div > img{
	max-width:100px;
	margin-top:15px;
}
/*マージン調整*/
.no3 .bc_pink .catch{
	margin-bottom:10px;
	line-height:1.5em;
}
.no3 .bc_white{
	padding-bottom:30px;
}
}