@import url(js/lightbox/lightbox.css);
@import url(orange.css);
@import url(kensui.css);

body {
  background-color: #E5E5E5;
  text-align: center;
  position: relative;
  }
/* タグ初期化
-------------------------------------------------*/
img {border: 0;}
h1,h2,h3,h4,h5,h6,h7,ul,li,dl,dt,dd,p,form,blockquote { margin:0; padding:0;}
a { color: #F08; text-decoration: none; }
a:hover { color: #08F; text-decoration: underline; }
a.blank { background: url(images/icon_blank.gif) right bottom no-repeat; padding-right: 15px; }
#btns a:hover, .btns a:hover { text-decoration: none; }
.error { color: #F33 !important; font-weight: bold; }
p.error { margin: 1em 0; padding: 0.5em; background: #FFD; line-height: 1.5em; }
.att { color: #F66; font-size: 80%; }

.toplink {
  margin: 0 10px 20px 0;
  padding: 10px 0;
  border-bottom: 1px dotted #FF9D00;
  clear: left;
  position: relative;
}
.footlink {
  text-align: center;
  margin: 20px 0 !important;
  padding: 10px 0;
  border-top: 1px dotted #FF9D00;
  clear: left;
  position: relative;
  width: 98%;
}
.toplink a, .footlink a {
  font-size: 8pt;
  color: #999;
  padding-left: 15px;
  line-height: 12pt;
  background: url(images/bullet_arrow_gray.gif) 0 -2px no-repeat;
}
p.toplink a:hover, p.footlink a:hover {
  color: #08F; text-decoration: underline;
}


/* 入力フォーム用テーブル 
-------------------------------------------------*/
div#center-area table.formtable {
  border-collapse: separate; border-spacing: 0 10px; margin: 1em;
  font-size: 10pt; width: 80%;
}
  div#center-area table.formtable
     tr  { margin-top: 10px; }
  /* 見出し */
  div#center-area table.formtable
     tr th { 
        color: #666;
        padding: 5px 3px;
        font-weight: normal;
        vertical-align: top;
        border-right: 3px solid #999;
        border-bottom: 1px solid #EEE;
        white-space: nowrap;
     }
  /* セル */
  div#center-area table.formtable
     tr td {
       padding: 5px 3px 5px 10px; vertical-align: top;
       border-bottom: 1px solid #EEE; }
  div#center-area table.formtable
     tr td input, 
  div#center-area table.formtable
     tr td select { 
      font-size: 10pt; 
      border-width: 1px;
      border-style: solid;
      border-color: #555 #888 #888 #555;
      background: #F6F6F6 url(images/bg_input.gif) 0 0 no-repeat;
      margin: 2px 5px 2px 0; 
      padding: 2px;}
  /* 必須項目 */
  div#center-area table.formtable
    tr.require th {
      color: #CC7500; padding-right: 10px; border-color: #FFA81E;
      border-bottom: 1px solid #EEE; font-weight: bold;
      }
  div#center-area table.formtable
     tr.require td input,
  div#center-area table.formtable
     tr.require td select { 
      border-color: #994200 #CC7500 #CC7500 #994200;
      background: #FFF9EF url(images/bg_input_require.gif) 0 0 no-repeat;
     }

/* 細い線のテーブル
----------------------------------------------------------- */
table.thin-line {
  border-collapse: collapse; background: #FFF; width: 90%; margin: 1em 4%;
  font-size: 10pt;
}
table.thin-line th {
  background: #71CC2C url(images/bg_head_green.gif) left top repeat-x;
  color: #FFF; padding: 2px; text-align: center;
  border: 1px solid #3E9900;
}
table.thin-line td {
  font-family: 'Verdana', 'MS Gothic', 'Osaka', sans-serif;
  font-size: 8pt;
  color: #333;
  border: 1px solid #CCC;
  padding: 0 1em;
}
table.thin-line td img {
  vertical-align: middle;
  border:1px solid #DDD;
  margin: 2px;
}
td.date {
  font-family: 'Verdana', sans-serif;
}
td.price {
  font-family: 'Verdana', sans-serif;
  text-align: right;
}

#container {
  margin: 0 auto;
  width: 900px;
  overflow: hidden;
  text-align: left;
  background: #FFF;
  position: relative;
}
#head {
  background: #FFF url(images/bg_head.gif) left top repeat-x;
  float: left;
  width: 900px;
  margin-bottom: 20px;
}

#head h1 a {
  display: block;
  width: 900px;
  height: 0;
  padding-top: 95px;
  overflow: hidden;
  font-size: 1pt;
  margin-top: 15px;
  position: relative;
  background: url(images/logo.gif) 0 0 no-repeat;
}
#head ul#menu {
  width: 680px;
  height: 60px;
  float: right;
}
#head ul#menu li {
  list-style: none;
  display: block;
  float: right;
}
#head ul#menu li#regist, #head ul#menu li#regist a {
  width: 168px;
}
#head ul#menu li#item_list, #head ul#menu li#item_list a {
  width: 122px;
}
#head ul#menu li#howto, #head ul#menu li#howto a {
  width: 123px;
}
#head ul#menu li#confirm, #head ul#menu li#confirm a {
  width: 121px;
}
#head ul#menu li#login, #head ul#menu li#login a,#head ul#menu li#logout, #head ul#menu li#logout a  {
  width: 121px;
}

#head ul#menu li a {
  height: 60px;
  float: right;
  text-indent: -150px;
  overflow: hidden;
  display: block;
}
#head ul#menu li a:hover {
  text-decoration: none;
}
#head ul#menu li#regist a {
  background: url(images/menu.gif) 0 0 no-repeat;
}
#head ul#menu li#item_list a {
  background: url(images/menu.gif) -168px 0 no-repeat;
}
#head ul#menu li#howto a {
  background: url(images/menu.gif) -290px 0 no-repeat;
}
#head ul#menu li#confirm a {
  background: url(images/menu.gif) -413px 0 no-repeat;
}
#head ul#menu li#login a {
  background: url(images/menu.gif) -657px 0 no-repeat;
}
#head ul#menu li#logout a {
  background: url(images/menu.gif) -536px 0 no-repeat;
}

#head ul#menu li#regist a:hover {
  background: url(images/menu_hover.gif) 0 0 no-repeat;
}
#head ul#menu li#item_list a:hover {
  background: url(images/menu_hover.gif) -168px 0 no-repeat;
}
#head ul#menu li#howto a:hover {
  background: url(images/menu_hover.gif) -290px 0 no-repeat;
}
#head ul#menu li#confirm a:hover {
  background: url(images/menu_hover.gif) -413px 0 no-repeat;
}
#head ul#menu li#login a:hover {
  background: url(images/menu_hover.gif) -657px 0 no-repeat;
}
#head ul#menu li#logout a:hover {
  background: url(images/menu_hover.gif) -536px 0 no-repeat;
}



#main-area {
  clear: left;
  width: 880px;
  margin: 0 0 10px 10px;
  position: relative;
  background: #FFF;
/*  border: 1px solid #6CF;*/
}
#center-area {
  width: 700px;
  float: left;
  position: relative;
}

div#center-area h2 {
  font-size: 12pt;
  font-weight: bold;
  color: #5B9FFB;
  margin: 1em 0 0 1em;
  clear: left;
}
#center-area #items {
  float: left;
  position: relative;
  margin-bottom: 20px;
}
#center-area #items dl.unit {
  width: 220px;
  float: left;
  margin: 10px 10px 0 0;
  background: url(images/bg_item-unit.gif) right top no-repeat;
}
#center-area #items dl.unit dt, #center-area #items dl.unit dd {
  width: 108px;
  height: 108px;
  overflow: hidden;
  float: left;
  position: relative;
}
#center-area #items dl.unit dt {
  border: 1px solid #FFA81E;
  background: #FFF;
}
#center-area #items dl.unit dt img {
  width: 90px;
  overflow: hidden;
  margin: 10px;
}
#center-area #items dl.unit dt div.outofstock a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 110px;
  height: 110px;
  text-indent: -100000em;
  overflow: hidden;
  background: url(images/outofstock.gif) right bottom no-repeat;
  z-index: 50;
}
#center-area #items dl.unit dd p {
  font-family: "Verdana", "Arial", "MS Gothic", "Osaka" sans-serif;
  font-size: 8pt;
  line-height: 9pt;
  margin: 0.5em 0.5em;
  color: #666;
}
#center-area #items dl.unit dd a {
  padding-left: 15px;
  background: url(images/bullet_tri_orange.gif) 0 1px no-repeat;
}
#center-area #items dl.unit dd a:hover {
  padding-left: 15px;
  background: url(images/bullet_tri_aqua.gif) 1px 1px no-repeat;
}
#center-area #items dl.unit dd a.outofstock {
  color: #7E4D5E;
  padding-left: 15px;
  background: #DDD url(images/bullet_tri_gray.gif) 0 1px no-repeat;
}
#center-area #items dl.unit dd p {
  clear: right;
}
#center-area #items dl.unit dd p.price {
  color: #F60;
  font-size: 10pt;
  font-weight: bold;
  text-align: right;
  margin-top: 1em;
}
#side-area {
  width: 170px;
  min-height: 400px;
  margin: 20px 0 0 10px;
  float: left;
  clear: none;
/*  border: 1px solid #F6C;*/
}
#side-area * {
  border: 1px solid #FFFFFF;
}/*\*/
#side-area * {
  border-width: 0px;
}/**/
#side-area .view-cart {
  text-align:center;
}
#side-area #free {
  background: #E7E7E7;
  margin-top: 20px;
}
#side-area #free * {
  border-width: 0 !important;
}
#side-area #free h3 {
  background: #92D946 url(images/bg_head_green.gif) 0 0 repeat-x;
  color: #FFF;
  padding: 2px 5px;
  font-family: 'Verdana', 'Arial', 'MS Gothic', 'Osaka', sans-serif;
  font-size: 10pt;
  text-align: left;
}
#side-area #free dl {
  margin: 10px;
}
#side-area #free dl dt {
  color: #4B9E01;
  font-size: 8pt;
}
#side-area #free dl dd {
  margin: 0.5em 1em;
  padding-bottom: 5px;
  line-height: 130%;
  font-size: 10pt;
  border-bottom: 1px dashed #CCC;
}
#side-area #mypage-explanation {
  font-size: 8pt;
  margin: 0 0 10px 0;
  padding: 10px 0;
  border: 1px solid #EEB9CA;
}
#side-area #mypage-explanation a img {
  margin: 0 20px;
}

#side-area #mypage-explanation a:hover {
  background: url(images/btn_mypage.gif) center -46px no-repeat;
}
#side-area #mypage-explanation p {
  margin: 0 10px;
  color: #666;
  }
#side-area ul#fixed-contents {
  padding: 15px 0;
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
  font-size: 8pt;
}
#side-area #fixed-contents li {
  margin: 0.5em 0;
  padding-left: 16px;
  list-style: none;
  line-height: 8pt;
  background: url(images/bullet_square_pink.gif) 0 0 no-repeat;
}
#side-area #geotrust {
  margin: 10px;
}
#side-area #geotrust div {
  text-align: center;
  margin: 10px 0;
}
#side-area #geotrust p {
  font-size: 8pt;
  color: #666;
  line-height: 120%;
}

#footer {
  background: #E5E5E5;
  color: #666;
  clear: left;
  padding: 5px 1em;
  font-size: 8pt;
  text-align: right;
}
#footer p {
  font-family: "Verdana", "Arial", sans-serif;
}


/* 商品詳細ページ
--------------------------------------------------------------------*/
#pic {
  width: 270px;
  float: left;
  border: 1px solid #AAA;
  margin: 0 10px 20px 0;
  position: relative;
  background: #FFF;
  z-index: 10;
  overflow: hidden;
}
#pic img {
  margin: 10px;
}

#pic div.outofstock a {
  display: block;
  position: absolute;
  width: 270px;
  height: 270px;
  bottom: 0;
  right: 0;
  text-indent: -100000em;
  overflow: hidden;
  background: url(images/outofstock.gif) right bottom no-repeat;
  z-index: 50;
}
#item {
  float: left;
}
#item #data {
  float: left;
  width: 400px;
}
#item h1 {
  font-size: 21pt;
  font-weight: bold;
  color: #FF9C00;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border-width: 0 !important;
  font-family: "Verdana", "Arial", "MS Gothic", "Osaka" sans-serif;
}
#item h2 {
  font-size: 12pt;
  font-weight: bold;
  color: #5B9FFB;
  margin: 0 0 10px 0 !important;
  padding: 5px 0 0 0 !important;
  border-top: 1px solid #8ED2FF;
  text-align: right;
}
table.item_info {
  border-collapse: separate;
  border-spacing: 2px;
  margin-bottom: 1em;
  border-width: 0;
}
table.item_info th {
  font-size: 10pt;
  line-height: 100%;
  color: #FF9C00;
  font-weight: normal;
  padding: 0 1em 0 0;
  border-width: 0 2px 0 0;
  border-style: solid;
  border-color: #FFCF33;
  white-space: nowrap;
}
table.item_info td {
  font-size: 10pt;
  line-height: 100%;
  padding: 2px 0 2px 1em;
  color: #666;
  border-width: 0;
}
table.item_info td strong{
  font-size: 120%;
  color: #47C70F;
}
#item div#btns {
  margin-bottom: 10px;
  float: right;
}
#item div#btns img {
  margin: 0 0 10px 0;
}
#item div#btns form {
  margin: 0; padding: 0; display: inline;
}
#item div#btns input#order_btn {
  width: 145px;
  height: 40px;
  margin: 0 0 10px 0;
}
div#item_explanation {
  clear: right;
  font-size: 10pt;
  line-height: 16pt;
  background: #F9FFF0 url(images/bg_explanation.gif) 0 0 repeat-x;
  padding: 0.8em 1.2em;
  position: relative;
  margin-bottom: 20px;
}
div#item_explanation h3 {
  color: #47C70F;
  font-size: 12pt;
  border-bottom: 1px solid #72CC2C;
  margin-bottom: 0.7em;
}

/* 商品の確認（カート）
--------------------------------------------------------------------------*/
div.cart {
  margin-bottom: 40px;
}
div.cart h1 {
  font-size: 18pt;
  font-weight: bold;
  color: #FF9C00;
  margin: 20px 0;
  border-bottom: 1px dashed #FF9C00;
  padding: 5px 0 5px 35px;
  background: url(images/bullet_square_orange.gif) left center no-repeat;
}
div.cart p {
  font-size: 10pt;
  color: #666;
}
div.cart table.cart_table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 11pt;
  width: 95%;
  margin: 0 auto;
}
div.cart table.cart_table thead th {
  text-align: center;
  color: #FFFFFF;
  font-size: 10pt;
  border-bottom: 1px solid #3E9900;
  margin-bottom: 0.7em;
  padding: 5px 10px;
  background: #71CC2C url(images/bg_head_green.gif) left top repeat-x;
}
div.cart table.cart_table tfoot {
  color: #FF3333;
}
div.cart table.cart_table th,
div.cart table.cart_table td {
  padding: 0.3em;
  border: 1px solid #CCC;
  vertical-align: middle;
}
div.cart table.cart_table th img ,
div.cart table.cart_table td img {
  vertical-align: middle;
}
div.cart table.cart_table td.num,
div.cart table.cart_table td.num input {
  text-align: right;
  font-family: 'Arial','Verdana', sans-serif;
}
div.cart table.cart_table td.func {
  text-align: center;
}
.btn_continue {
  display: block;
  float: left;
  width: 145px;
  height: 50px;
  background: url(images/btn_continue.gif) 0 0 no-repeat;
}
.btn_continue span {
  display: none;
}
div.cart div.btn {
  margin: 20px 0;
  text-align: right;
}
div.cart #pic {
  width: 120px;
  margin: 10px 10px 0px 12px;
}
/* 配送方法　大学指定
--------------------------------------------------------------------------*/
div.cart table.thin-line td {
  font-size: 10pt;
}
div.cart div.address {
  font-size: 8pt;
  color: #CC7500;
}
div.cart a.map {
  display: block;
  float: right;
  width: 60px;
  margin: 3px 0 0 0;
  padding: 6px 0 6px 30px;
  line-height: 1em;
  background: url(images/btn_map.gif) 0 0 no-repeat;
}
div.cart input#btn_next {
  float: right;
}


/* 会員ログイン
--------------------------------------------------------------------------*/
div#center-area h1 {
  font-size: 18pt;
  font-weight: bold;
  color: #FF9C00;
  margin: 20px 0;
  border-bottom: 1px dashed #FF9C00;
  padding: 5px 0 5px 35px;
  background: url(images/bullet_square_orange.gif) left center no-repeat;
}

form#login-form {
  display: block;
  width: 220px;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
  font-size: 10pt;
  color: #333;
  background: #F9FFF0 url(images/bg_explanation.gif) 0 0 repeat-x;
  border: 1px solid #7ED134;
}
form#login-form h3 {
  color: #FFFFFF;
  font-size: 10pt;
  font-family: 'Verdana', 'Arial', sans-serif;
  border-bottom: 1px solid #3E9900;
  margin-bottom: 0.7em;
  padding: 5px 10px;
  background: #71CC2C url(images/bg_head_green.gif) left top repeat-x;
}
form#login-form dl,form#login-form p,form#login-form div {
  margin: 1em;
}
form#login-form dl dt {
  font-weight: bold;
  font-size: 10pt;
  color: #3E9900;
}
form#login-form p {
  font-size: 8pt;
}
form#login-form div.btns {
  /*text-align: right;*/
}
form#login-form div.btns #login_btn {
  width: 106px;
  height: 33px;
  float: right;
}
#text_username, #text_password {
  width: 180px;
  height: 1.3em;
  font-size: 10pt;
}
div#regist-area {
  width: 450px;
  float: left;
  margin-bottom: 20px;
}

div#regist-area h2 {
  font-size: 12pt;
  font-weight: bold;
  color: #5B9FFB;
  margin: 0 0 1em 0;
}
div#regist-area p {
  font-size: 8pt;
}
div.cart ul,
div#regist-area ul {
  position: relative;
  margin: 1em 0 1em 2em;
  font-size: 10pt;
  color: #666;
}
div.cart ul li,
div#regist-area li {
  margin: 0.8em 0;
  padding-left: 16px;
  list-style: none;
  line-height: 10pt;
  background: url(images/bullet_square_pink.gif) 0 0 no-repeat;
}
div#regist-area p.btns {
  text-align: center;
}
div#regist-area a#btn_regist {
  display: block;
  width: 165px;
  height: 60px;
  text-indent: -10000em;
  float: right;
  overflow: hidden;
  background: url(images/menu.gif) 2px 0 no-repeat;
  margin: 0;
}
/* 会員登録
--------------------------------------------------------------------------*/
div.member {
  margin-bottom: 20px;
}
div.member p {
  font-size: 10pt;
}
div#agreement_area {
  text-align: right;
  width: 79%;
  margin: 1em 2em;
  font-size: 10pt;
  }
div#agreement_area iframe#agreement-frame {
  width: 100%;
  display: block;
  margin-bottom: 1em;
  border-width: 1px;
  border-style: solid;
  border-color: #FFA81E #FFDB51 #FFDB51 #FFA81E;
}
div.member div.btns {
  float: right;
}
a.btn_order {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -300px;
  overflow: hidden;
  float: left;
  background: url(images/btn_cart.gif) 2px 0 no-repeat;
}
a.btn_back {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -300px;
  overflow: hidden;
  float: left;
  background: url(images/btn_back.gif) 2px 0 no-repeat;
}
a.btn_back_no_float {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -300px;
  overflow: hidden;
  background: url(images/btn_back.gif) 2px 0 no-repeat;
}
a.btn_regist {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -300px;
  overflow: hidden;
  float: left;
  background: url(images/btn_regist.gif) 2px 0 no-repeat;
}
a.btn_edit {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -300px;
  overflow: hidden;
  float: left;
  background: url(images/btn_modify.gif) 2px 0 no-repeat;
}
a.btn_leave {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -10000em;
  overflow: hidden;
  float: left;
  background: url(images/btn_leave.gif) 2px 0 no-repeat;
}
a.btn_send {
  display: block;
  width: 145px;
  height: 40px;
  text-indent: -10000em;
  overflow: hidden;
  float: left;
  background: url(images/btn_send.gif) 2px 0 no-repeat;
}
/* マイページ関連
---------------------------------------------------------------------*/
div.mypage p {
  margin: 1em 3em;
}
div.mypage ul {
  margin: 1em 3em;
}
div.mypage ul li {
  list-style: none;
  line-height: 1em;
  margin: 0.5em;
}
div.mypage ul li a {
  padding-left: 15px;
  background: url(images/bullet_tri_orange.gif) 0 1px no-repeat;
}
div.mypage ul li a:hover {
  padding-left: 15px;
  background: url(images/bullet_tri_aqua.gif) 1px 1px no-repeat;
}
div.mypage div.btns {
  float: right;
}
div.mypage div.navi {
  width: 90%;
  font-size: 10pt;
  text-align: right;
}
div.mypage .pageNavi {
  position: relative;
  float: left;
  clear: both;
  font-size: 10pt;
}
div.mypage table.thin-line {
  clear: left;
}
.prevAnchor {
  display: block;
  float: left;
}
.nextAnchor {
  display: block;
  float: right;
}

/* リマインダ
*-----------------------------------------------------------------*/
div.reminder {
  position: relative;
}
div.reminder table.formtable th {
  width: 10em;
}
div.reminder div.btns {
  text-align: right;
}
div.reminder div.btns span {
  display: none;
}
div.reminder p {
  font-size: 11pt;
  color: #666;
  margin: 0 20px;
}
div.reminder h2 {
  position: relative;
  clear: right;
  margin-top: 20px;
  padding-top: 10px;
  border-top: 1px solid #06F;
}
div.reminder input#btn_confirm {
  float: right;
}


/* ご利用方法
----------------------------------------------------------------*/

div.howto dl {
  margin: 1em 0;
}
div.howto dl dt {
  margin: 1em 0;
  color: #5B9FFB;
  font-weight: bold;
  font-size: 11pt;
  clear: right;
}
div.howto dl dd {
  font-size: 10pt;
  line-height: 140%;
  padding: 1em 0 1em 0;
  border-top: 1px solid #DDD;
}
div.howto dl dd div.pic {
  width: 280px;
  float: right;
}
div.howto dl dd div.pic img {
}

div.howto dl dd p {
  width: 400px;
  margin-top: 1em;
}