@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
body {
	font-family: 'Noto Sans Japanese', sans-serif;
	padding: 0;
	margin: 0;
}
.clear {
	clear: both;
}
.font_R {
	color: rgba(255,0,8,1.00);
}
.font_G {
	color: rgba(9,148,167,1.00);
}
.font_P {
	color: rgba(191,10,125,1.00);
}
.font_O {
	color: rgba(255,102,0,1.00);
}
.font_s {
	font-size: 0.7em;
}
#sp_menu {
	max-width: 768px;
	margin-left: auto;
	margin-right: auto;
}
#sp_menu img {
	width: 100%;
	vertical-align: bottom;
}
#sp_menu1 {
	width: 25%;
	float: left;
}
#sp_menu2 {
	width: 25%;
	float: left;
}
#sp_menu3 {
	width: 25%;
	float: left;
}
#sp_menu4 {
	width: 25%;
	float: left;
}

@media screen and (max-width: 769px) {
.Sp_dis {
	display: none;
}
}

@media screen and (min-width: 769px) {
.Pc_dis {
	display: none;
}
}
a img:hover {
	opacity: 0.8;
}
header {
	width: 100%;
	margin-top: 2%;
	margin-bottom: 2%;
}

@media screen and (max-width: 640px) {
header {
	margin-top: 3.5%;
}
}
/*メインイメージ*/
#main_img {
	width: 100%;
	margin-top: 0.3%;
	position: relative;
	background-size: cover;
}
.box {
	width: 100%;
	height: 600px;
	background-size: cover;
	background-position: center 0%;
}

@media screen and (max-width: 640px) {
.box {
	height: 250px;
}
}
#second_box {
	width: 100%;
	background-position: 100% 0%;
	background-repeat: no-repeat;
}
#second_box img {
	width: 100%;
}
#logo {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 768px) {
#logo {
	margin-top: 1.5%;
}
}
#logo_img {
	width: 20%;
	float: left;
	margin-left: 39%;
}

@media screen and (max-width: 768px) {
#logo_img {
	width: 26.04%;
	margin-left: 36%;
}
}

@media screen and (max-width: 640px) {
#logo_img {
	width: 31.25%;
	margin-left: 34%;
}
}
#logo_img img {
	width: 100%;
	vertical-align: bottom;
}
/*FBロゴ*/
#fb {
	width: 2.9%;
	float: right;
	margin-right: 2%;
	margin-top: 3%;
}

@media screen and (max-width: 768px) {
#fb {
	width: 3.77%;
}
}

@media screen and (max-width: 640px) {
#fb {
	width: 4.53%;
}
}
#fb img {
	width: 100%;
}
/*インスタロゴ*/
#in {
	width: 2.9%;
	float: right;
	margin-right: 2%;
	margin-top: 3%;
}

@media screen and (max-width: 768px) {
#in {
	width: 3.77%;
}
}

@media screen and (max-width: 640px) {
#in {
	width: 4.53%;
}
}
#in img {
	width: 100%;
}
/*メールアイコン*/
#mail_img {
	width: 4.4%;
	float: right;
	margin-top: 3%;
	margin-right: 1%;
}

@media screen and (max-width: 768px) {
#mail_img {
	width: 5.729%;
}
}

@media screen and (max-width: 640px) {
#mail_img {
	width: 6.875%;
}
}
#mail_img img {
	width: 100%;
}
/*三つの窓*/
#main_menu {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1%;
	padding-right: 1%;
	margin-top: 3%;
}
/*和雑貨*/
#shop_img {
	width: 30%;
	float: left;
}

@media screen and (max-width: 640px) {
#shop_img {
	width: 32%;
}
}
#shop_img img {
	width: 100%;
	vertical-align: bottom;
}
/*卒業アルバム*/
#album_img {
	width: 30%;
	float: left;
	margin-left: 5%
}

@media screen and (max-width: 640px) {
#album_img {
	width: 32%;
	margin-left: 2%
}
}
#album_img img {
	width: 100%;
	vertical-align: bottom;
}
/*撮影*/
#photo_img {
	width: 30%;
	float: left;
	margin-left: 5%
}

@media screen and (max-width: 640px) {
#photo_img {
	width: 32%;
	margin-left: 2%
}
}
#photo_img img {
	width: 100%;
	vertical-align: bottom;
}
/*以下コンテンツ*/
/*和雑貨販売コンテンツ*/
#shop_contents {
	max-width: 1600px;
	padding-bottom: 3%;
	margin-top: 2%;
	margin-left: auto;
	margin-right: auto;
	background-color: rgba(15,158,169,1.00);
	background-image: url(../images/info_back.gif);
}
#shop {
	padding-top: 2.5%;
	padding-bottom: 2.5%;
	background-image: url(../images/shop_back.jpg);
	background-position: 0% center;
	background-size: cover;
}
#shop_outline {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1%;
	padding-right: 1%;
}
#about_shop {
	width: 100%;
}
#shop_title {
	width: 40%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5%;
}

@media screen and (max-width: 768px) {
#shop_title {
	width: 52.08%;
}
}

@media screen and (max-width: 640px) {
#shop_title {
	width: 62.5%;
}
}
#shop_title h2 {
	margin: 0;
}
#shop_title h2 img {
	width: 100%;
	vertical-align: bottom;
}
#shop_ex {
	width: 75%;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 768px) {
#shop_ex {
	width: 96%;
}
}
#shop_ex p {
	color: rgba(255,255,255,1.00);
	font-size: 0.95em;
	font-weight: 300;
	line-height: 1.2em;
	margin-top: 1%;
	margin-bottom: 1%;
}

@media screen and (max-width: 768px) {
#shop_ex p {
	font-size: 0.8em;
	font-weight: 100;
}
}
#shop_ex p a {
	color: rgba(248,246,39,1.00);
	font-weight: 300;
	font-size: 1.1em;
}

@media screen and (max-width: 640px) {
#shop_ex p a {
	font-size: 0.95em;
}
}
.cart img {
	float: left;
	padding-top: 5px;
	margin-right: 10px;
	vertical-align: bottom;
}

@media screen and (max-width: 640px) {
.cart img {
	float: left;
	padding-top: 0;
}
}
.cart p {
	padding-top: 1.6%;
}

@media screen and (max-width: 640px) {
#cart p {
	padding-top: 2.8%;
}
}
/*サンプル写真*/
.shop_exe {
	width: 60%;
	padding-top: 2%;
	float: right;
}

@media screen and (max-width: 640px) {
.shop_exe {
	width: 75%;
	float: none;
	margin-left: auto;
	margin-right: auto;
}
}
.shop_exe img {
	width: 25%;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover01 img:hover {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
/*お知らせ*/
#information_wrap {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-top: 3%;
}
#information_title {
	width: 25%;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 768px) {
#information_title {
	width: 32.55%;
}
}

@media screen and (max-width: 640px) {
#information_title {
	width: 39.06%;
}
}
#information_title h2 {
	margin-top: 0;
}
#information_title h2 img {
	width: 100%;
	vertical-align: bottom;
}
#information {
	width: 100%;
	height: 100px;
	overflow-y: scroll;
}
#information ul li {
	text-align: left;
	padding-left: 1%;
	font-size: 0.95em;
	font-weight: 100;
}
#announce {
	max-width: 730px;
	height: 240px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 1%;
	padding: 1%;
	margin-bottom: 0;
	background-color: rgba(255,255,255,1.00);
}

@media screen and (max-width: 768px) {
#announce {
	max-width: 90%;
	margin-right: auto;
	margin-left: auto;
}
}

@media screen and (max-width: 640px) {
#announce {
	height: 230px;
}
}
/*ifram用*/
#box {
	max-width: 720px;
	height: 240px;
}
#box iframe {
	width: 720px;
	height: 240px;
	border: 0;
}

@media screen and (max-width: 768px) {
#box {
	overflow: auto;
	width: 98%;
	height: 230px;
	margin-right: auto;
	margin-left: auto;
}
#box iframe {
	width: 98%;
	height: 225px;
	margin-right: auto;
	margin-left: auto;
}
}
/*卒業アルバムコンテンツ*/
#album_contents {
	width: 100%;
	background-image: url(../images/album_contents_back.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	margin-bottom: 2%;
	margin-top: 5%;
}

@media screen and (max-width: 768px) {
#album_contents {
	background-image: url(../images/album_contents_back_sp.png);
}
}
#album_title_wrap {
	width: 100%;
}
#album_title {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
#album_title_img {
	width: 35%;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 768px) {
#album_title_img {
	width: 45.57%;
}
}

@media screen and (max-width: 640px) {
#album_title_img {
	width: 54.68%;
}
}
#album_title_img img {
	width: 100%;
	vertical-align: bottom;
}
#album {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 0.5%;
	padding-bottom: 0;
	padding-left: 1%;
	padding-right: 1%;
}

@media screen and (max-width: 768px) {
#album {
	width: 95%;
}
}
.album_ex {
	margin-top: 2%;
	margin-bottom: 3%;
}
.album_ex img {
	width: 20%;
}
/*アルバム制作の説明*/
#album_point {
	width: 46%;
	margin-left: auto;
	margin-right: auto;
	float: left;
	padding: 2%;
}

@media screen and (max-width: 768px) {
#album_point {
	width: 96%;
	margin-bottom: 2%;
}
}
#album_point p {
	margin: 0;
	font-size: 1em;
	font-weight: 300;
	line-height: 1.2em;
	margin-bottom: 2%;
}

@media screen and (max-width: 768px) {
#album_point p {
	font-size: 0.8em;
	font-weight: 100;
}
}
/*納品までの流れ*/
#album_oder {
	width: 44%;
	margin-left: auto;
	margin-right: auto;
	float: right;
	padding: 2%;
	background-color: rgba(252,252,252,0.30);
}

@media screen and (max-width: 768px) {
#album_oder {
	width: 96%;
	float: none;
}
}
#album_oder p {
	font-size: 1em;
	font-weight: 500;
	margin-bottom: 1%;
}

@media screen and (max-width: 768px) {
#album_oder p {
	font-size: 0.9em;
	font-weight: 300;
	color: rgba(255,0,8,1.00);
}
}
#album_oder ol {
	margin-top: 0;
}
#album_oder li {
	font-size: 0.9em;
	font-weight: 100;
}

@media screen and (max-width: 768px) {
#album_oder li {
	font-size: 0.8em;
}
}
/*お問い合わせ*/
#contact_album {
	width: 79.54%;
}

@media screen and (max-width: 768px) {
#contact_album {
	width: 45.57%;
}
}

@media screen and (max-width: 640px) {
#contact_album {
	width: 54.68%;
	margin-left: auto;
	margin-right: auto;
}
}
#contact_album img {
	width: 100%;
}
/*写真撮影ンテンツ*/
#photo_contents {
	width: 100%;
}
#photo_title_wrap {
	width: 100%;
}
#photo_title {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	border-top: 1px solid rgba(255,102,0,1.00);
	border-bottom: 1px solid rgba(255,102,0,1.00);
}
#photo_title_img {
	width: 35%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 2%;
	padding-bottom: 2.5%;
}

@media screen and (max-width: 768px) {
#photo_title_img {
	width: 45.57%;
}
}

@media screen and (max-width: 640px) {
#photo_title_img {
	width: 54.68%;
}
}
#photo_title_img h2 {
	margin: 0;
}
#photo_title_img h2 img {
	width: 100%;
	vertical-align: bottom;
}
#photo {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 2%;
	padding-bottom: 3%;
	padding-left: 1%;
	padding-right: 1%;
}

@media screen and (max-width: 768px) {
#photo {
	width: 95%;
	padding-top: 3%;
}
}
#photo p {
	margin-top: 0;
	margin-bottom: 0.8%;
	font-size: 1em;
	font-weight: 300;
	line-height: 1.2em;
}

@media screen and (max-width: 768px) {
#photo p {
	font-size: 0.8em;
	font-weight: 100;
	line-height: 1.2em;
}
}
#photo dl {
	margin-top: 0.5%;
}
#photo dt {
	font-size: 1em;
	font-weight: 500;
}

@media screen and (max-width: 768px) {
#photo dt {
	font-size: 0.85em;
	font-weight: 500;
}
}
#photo dd {
	margin-top: 0.1em;
	font-size: 0.95em;
	font-weight: 300;
}

@media screen and (max-width: 768px) {
#photo dd {
	font-size: 0.8em;
}
}
/*お問い合わせ*/
#contact_photo {
	width: 35%;
}

@media screen and (max-width: 768px) {
#contact_photo {
	width: 45.57%;
}
}

@media screen and (max-width: 640px) {
#contact_photo {
	width: 54.68%;
	margin-top: 3%;
	margin-left: auto;
	margin-right: auto;
}
}
#contact_photo img {
	width: 100%;
}
/*会社概要*/
#about_contents {
	width: 100%;
	background-image: url(../images/about_back.jpg);
	padding-bottom: 3%;
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}
#about {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1%;
	padding-right: 1%;
}

@media screen and (max-width: 768px) {
#about {
	background-image: none;
}
}
#about_title {
	width: 30%;
	padding-top: 5%;
	padding-left: 10%;
}
#about_title h2 {
	margin: 0;
	padding: 0;
}

@media screen and (max-width: 768px) {
#about_title {
	width: 39.06%;
}
}

@media screen and (max-width: 640px) {
#about_title {
	width: 46.87%;
}
}
#about_title img {
	width: 100%;
	vertical-align: bottom;
}
#about dl {
	padding-left: 10%;
}
#about dt {
	font-weight: 500;
	font-size: 0.95em;
	color: rgba(70,0,1,1.00);
	margin-bottom: 0.1em;
}

@media screen and (max-width: 768px) {
#about dt {
	font-weight: 500;
	font-size: 0.8em;
}
}
#about dd {
	font-weight: 100;
	font-size: 0.85em;
	margin-left: 3%;
	margin-bottom: 2%;
	color: rgba(70,0,1,1.00);
}

@media screen and (max-width: 768px) {
#about dd {
	font-size: 0.8em;
}
}
#copyright {
	width: 50%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
#copyright p {
	font-size: 0.8em;
	font-weight: 100;
}
/*ページトップボタン*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
}

@media screen and (max-width: 768px) {
#page-top {
	bottom: 15px;
	right: 15px;
}
}
#page-top a {
	display: block;
}
#page-top a:hover {
	opacity: 0.8;
}
/*お問い合わせページ用*/
/*パンくず*/
.pankuzu {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1%;
	margin-bottom: 1%;
	padding-left: 1%;
}
.pankuzu ul {
	margin: 0;
	padding: 0;
}
.pankuzu li {
	display: inline;
	float: left;
	font-size: 0.85em;
	font-weight: 100;
}

@media screen and (max-width: 768px) {
.pankuzu li {
	font-size: 0.8em;
}
}
#contact_title {
	width: 100%;
	background-image: url(../images/second_about_back.jpg);
	background-size: cover;
}
#contact_title_img {
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

@media screen and (max-width: 768px) {
#contact_title_img {
	max-width: 200px;
}
}
#contact_title_img img {
	width: 100%;
}
/*お問い合わせコンテンツ*/
#contact_contents {
	width: 100%;
	margin-bottom: 2%;
}
#contact_contents h2 {
	color: rgba(9,148,167,1.00);
	font-size: 2.5em;
	font-weight: 100;
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: 2%;
	display: block;
	background-image: url(../images/h_back.png);
	background-position: center center;
	background-repeat: no-repeat;
	text-align: center;
}

@media screen and (max-width: 768px) {
#contact_contents h2 {
	font-size: 1.5em;
	padding-top: 1%;
	padding-bottom: 1%;
	margin-top: 10px;
	background-size: contain;
}
}
/*フォーム*/
#form_contents {
	width: 100%;
	padding-top: 0.2%;
	padding-bottom: 1%;
}
#form_contents_wrap {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1%;
	padding-right: 1%;
}
#form_contents_wrap p {
	font-size: 1em;
	font-weight: 100;
	margin-top: 1%;
	margin-bottom: 1%;
}

@media screen and (max-width: 640px) {
#form_contents_wrap p {
	font-size: 0.85em;
}
}
#formWrap {
	width: 90%;
	margin: 0 auto;
}

@media screen and (max-width: 640px) {
#formWrap {
	width: 100%;
}
}
#formWrap h4 {
	font-size: 1em;
	font-weight: 500;
	color: rgba(255,0,0,1.00)
}

@media screen and (max-width: 640px) {
#formWrap h4 {
	font-size: 0.9em;
	font-weight: 300;
}
}
#formWrap h3 {
	font-size: 1.5em;
	font-weight: 300;
	color: rgba(255,0,0,1.00);
	margin-bottom: 1%;
}

@media screen and (max-width: 640px) {
#formWrap h3 {
	font-size: 1.1em;
	font-weight: 300;
}
}
table.formTable {
	width: 100%;
	margin: 0 auto;
	border-collapse: collapse;
}
table.formTable td, table.formTable th {
	border: 1px solid rgba(204,204,204,1.00);
	padding: 10px;
}
table.formTable th {
	width: 25%;
	font-size: 1em;
	font-weight: 300;
	background-color: rgba(9,148,167,0.80);
	text-align: left;
	color: rgba(255,255,255,1.00);
}

@media screen and (max-width: 640px) {
table.formTable th {
	font-size: 0.85em;
	font-weight: 300;
}
}
table.formTable td {
	font-size: 0.9em;
	font-weight: 100;
}

@media screen and (max-width: 640px) {
table.formTable td {
	font-size: 0.8em;
}
}
select {
	width: 70%;
}
input[type=text] {
	width: 80%;
	box-sizing: border-box;
}
textarea[cols] {
	width: 80%;
	box-sizing: border-box;
}
/*送信完了ページ*/
#thanks {
	max-width: 100%;
	margin: 0 auto;
	line-height: 120%;
}
#thanks p {
	font-size: 1em;
	font-weight: 100;
}

@media screen and (max-width: 640px) {
#thanks p {
	font-size: 0.85em;
}
}