/*====================================================================================================================================================
   プログラム名: WetPanty用スタイルシート (Ver 1.0）
   Fail name   : Style-WetPanty.css
   Copyright   : 大日本電脳開発廠
   E-Mail      : webmaster@panty.work

------------------------------------------------------------------------------------------------------------------------------------------------------

 2016.04.23 新規リリース

====================================================================================================================================================*/

/*====================================================================================================================================================

 ■ 共通定義

====================================================================================================================================================*/

*
	{
		margin                     :    0px;
		padding                    :    0px;
		box-sizing                 : border-box;
	}

body
	{
/*		background                 : #360e22 url(../img/bodybg.gif) repeat-x;*/

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffd700+0,b22222+80 */

		background                 : rgb(255,215,0); /* Old browsers */
		background                 : -moz-linear-gradient(top,   rgba(255,215,0,1) 0%,rgba(0,0,36,1) 45%);                                     /* FF3.6-15 */
		background                 : -webkit-linear-gradient(top,rgba(255,215,0,1) 0%,rgba(0,0,36,1) 45%);                                     /* Chrome10-25,Safari5.1-6 */
		background                 : linear-gradient(to bottom,  rgba(255,215,0,1) 0%,rgba(0,0,36,1) 45%);                                     /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter                     : progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd700', endColorstr='#b22222',GradientType=0 ); /* IE6-9 */

		font-family                : Trebuchet MS;
	}

#Main-Wrapper
	{
		margin                     :    0px auto;
		padding                    :    0px;
/*		width                      :  960px;*/
	}

/*====================================================================================================================================================

 ■ ヘッダー関連定義

====================================================================================================================================================*/

#Header
	{
		display                    : block;
		width                      :  960px;
		padding                    :   10px 0px 0px 0px ;
		margin                     :    0px auto;
		overflow                   : hidden;
	}

#Header H1
	{
		color                      : #fff;
/*		width                      :  800px;*/
		font-size                  :   40pt;
		font-weight                : bold;
		font-style                 : italic;
		float                      : left;
		padding                    :  20px 0px 0px 0px;
	}

.Head-TitleArea
	{
		display                    : inline-block;
		height                     :  110px;
		text-align                 : middle;
	}

.Head-PicArea
	{
		display                    : inline-block;
		height                     :  110px;
		overflow                   : hidden;
	}

A
	{
		text-decoration            : none;
	}
A:hover
	{
		text-decoration            : underline;
	}

/*	< FORM >	*/

#FormArea
	{
		display                    : inline-block;
		vertical-align             : top;
		padding-top                :   45px;
		margin-left                : 350px;
		text-align                 : right;
	}

#Header FORM
	{
		margin                     :    0px auto;
		margin-bottom              :    5px;
		border-radius              :   10px !important;
	}

#Header INPUT[type='text']
	{
		margin                     :    0px auto;
		background-color           : transparent;
		Color                      : #00FFFF;
		width                      :  100px;
		font-size                  :    9pt;
		padding                    :    2px;
		border                     :    1px solid #FFFFFF;
		border-radius              :    5px !important;
		-moz-border-radius         :    5px;                /* firefox */
		-webkit-border-radius      :    5px;                /* chrome */
		-o-border-radius           :    5px;                /* opera */
	}

#Header INPUT[type='button']
	{
		margin                     :    0px auto;
		margin-top                 :   10px;
		Color                      : #FFFF00;
		width                      :   80px;
		font-size                  :    9pt;
		padding                    :    2px;
		background-color           : rgba(128,0,0,0.75);
		border                     :    1px;
		border-radius              :    5px !important;
		-moz-border-radius         :    5px;                /* firefox */
		-webkit-border-radius      :    5px;                /* chrome */
		-o-border-radius           :    5px;                /* opera */
		cursor                     : pointer;
	}

:placeholder-shown          { color:#777777; font-style : italic; }
::-webkit-input-placeholder { color:#777777; font-style : italic; }
:-moz-placeholder           { color:#777777; font-style : italic; }
::-moz-placeholder          { color:#777777; font-style : italic; }
:-ms-input-placeholder      { color:#777777; font-style : italic; }

/*====================================================================================================================================================

 ■ ContentsWrapper関連定義

====================================================================================================================================================*/

#ContentsWrapper
	{
		position                   : relative;
		display                    : block;
		margin                     :    0px auto;
		width                      :  960px;
/*		padding                    :   10px 0px 0px 0px ;*/
		overflow                   : hidden;
		overflow-y                 : auto;
	}

/*====================================================================================================================================================

 ■ Banner関連定義

====================================================================================================================================================*/

#Banner
	{
		margin                     :    0px auto;
		border-top                 :    1px solid #FF0000;
		width                      :  960px;
		height                     :  315px;
	}

.LeftImg
	{
		display                    : inline-block;
		padding                    :   16px 0 0 0px;
		width                      :  285px;
		text-align                 : center;
		overflow                   : hidden;
		margin                     :    0 20px 0 0;
	}

#InfoArea
	{
		position                   : relative;
		display                    : inline-block;
		width                      :  290px;
		height                     :  290px !important;
		margin                     :    0px 0px 0px 20px;
		padding                    :   10px 0px 0px 10px;
		border-radius              :     10px;
		-webkit-border-radius      :     10px;
		-moz-border-radius         :     10px;
		background                 : rgba(196,196,196,0.5);
		vertical-align             : top;
		margin-top                 :     20px;
/*		background                 : url(../img/relatedbg.png) 0 -3px no-repeat;*/
/*		background-attachment      : fixed;*/
/*		background-color           : transparent;*/
/*		-moz-background-size       : contain;
		background-size            : contain;*/
/*		-moz-background-size       :  289px 140px;
		background-size            :  289px 140px;*/
	}

.RightImg
	{
		display                    : inline-block;
		padding                    :   14px 0 0 0px;
		width                      :  285px;
		text-align                 : center;
		overflow                   : hidden;
	}

/*====================================================================================================================================================

 ■ BodyContents関連定義

====================================================================================================================================================*/

#BodyContents
	{
		width                      :  960px;
		margin                     :    1px 0 0 0;
		padding                    :   25px;
/*		border                     :    1px dotted #C0C0C0; /* Silver */

		background                 : rgb(0,0,0); /* Old browsers */
		background                 : -moz-linear-gradient(-45deg,   rgba(0,0,0,1) 0%,rgba(32,32,32,1) 80%);                                     /* FF3.6-15 */
		background                 : -webkit-linear-gradient(-45deg,rgba(0,0,0,1) 0%,rgba(32,32,32,1) 80%);                                     /* Chrome10-25,Safari5.1-6 */
		background                 : linear-gradient(135deg,        rgba(0,0,0,1) 0%,rgba(32,32,32,1) 80%);                                     /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter                     : progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd700', endColorstr='#b22222',GradientType=0 ); /* IE6-9 */
		background                 : url(http://system.panty.work/img/bg_main02.gif);
	}

.PicBox
	{
		display                    : inline-block;
		margin                     :    0 15px 0 0;
	}

.PicBox img
	{
		border                     :      2px solid #C0C0C0; /* Silver */
		width                      :    285px;
		border-radius              :     10px;
		-webkit-border-radius      :     10px;
		-moz-border-radius         :     10px;
		-moz-box-shadow            :      5px 5px  2.5px #888888; /*/* Firefox */
		-webkit-box-shadow         :      5px 5px  2.5px #888888; /*/* Safari  */
		box-shadow                 :      5px 5px  2.5px #888888; /*/* CSS3    */
	}

/*====================================================================================================================================================

 ■ Footer関連定義

====================================================================================================================================================*/

#FooterMenu
	{
		Position                   : relative;
		box-sizing                 : border-box;
		top                        :    0px;
		height                     :   50px !important;
		width                      :  100%;
		margin                     :    0px auto;
		border-top                 :    1px solid #C0C0C0; /* Silver */
		background                 : rgba(32,64,128,0.75);
/*		background                 : url(../img/footerbg.png) no-repeat;*/
/*		margin-top                 :   10px;*/
/*		padding-top                :   12px;*/
/*		border-radius              :   10px;
		-webkit-border-radius      :   10px;
		-moz-border-radius         :   10px;*/
/*		background                 : url(../img/logo.png) no-repeat 0 35px;*/
	}

/*====================================================================================================================================================

 ■ Figure関連定義

====================================================================================================================================================*/

Figure
	{
		position                   : relative;
		display                    : inline-block;
		overflow                   : hidden;
		width                      :  285px;
	}

Figcaption
	{
		position                   : absolute;
		top                        :    0;
		left                       :    0;
		z-index                    :    2;
		width                      :  100%;
		height                     :  100%;
		background                 : rgba(0,0,0,.6);
		-webkit-transition         : .3s;
		transition                 : .3s;
		opacity                    :    0;
	}

Figure:hover Figcaption
	{
		opacity                    :    1;
	}

Figure H3
	{
		padding                    :   20px 0 5px;
		color                      : #fff;
		font-size                  :   24px;
		text-align                 : center;
		font-family                : 'Open Sans', sans-serif;
		font-weight                :  600;
		vertical-align             : baseline;
		outline                    :    0;
		border                     :    0;
		margin                     :    0;
	}

Figure P
	{
		margin                     :    0;
		padding                    :    0;
		border                     :    0;
		color                      : #fff;
		text-align                 : center;
		font-family                : 'Open Sans', sans-serif;
		font-weight                :  400;
		outline                    :    0;
		font-size                  :  100%;
		font-weight                : normal;
		vertical-align             : baseline;
	}
