@charset "euc-jp";
@import url("column.css");

/** サイドバー ============================================================================================**/
aside > div { margin: 0 0 25px;}
aside strong { display: block;}

/* ショッピングサイトのご案内 */
aside .shopinfo strong { margin: 0 0 10px; font-size: 12px;}
aside .shopinfo > a {
    display: -webkit-flex;
    display: flex;
    padding: 4px 2px 2px;
    border: solid 1px #FF2F00; border-radius: 5px 5px 0 0;
    background: #F17A2A;
    color: #7E0507;
    font-size: 16px; font-weight: bold; line-height: 1.1em;
    text-decoration: none;}

aside .shopinfo > a img { width: 44px;}
aside .shopinfo > a p { margin: 0 0 0 5px;}
aside .shopinfo ul { 
    padding: 0 3px 3px;
    border: solid 1px #FF2F00; border-radius: 0 0 5px 5px;
    }

aside .shopinfo li { margin: 0 0 5px;}
aside .shopinfo li:nth-last-of-type(1) { margin: 0;}

aside .shopinfo li a { font-size: 14px; font-weight: bold;}
aside .shopinfo li p {
    padding: 3px 3px 0;
    font-size: 12px; line-height: 1.1em;}

@media screen and (max-width:999px){
    aside .shopinfo,
    aside .links { display: none;}
}
    
/**============================================================================================ サイドバー **/

/** メインコンテンツ ============================================================================================**/

main { font-size: 16px; line-height: 1.6em;}
article section { margin: 0 0 40px;}

main h3 { 
    height: 30px; margin: 0 0 15px; padding: 0 0 0 8px;
    background: url(../../e/dry-suits_select/images/tab.png); 
    color: #fff; font-size: 16px; font-weight: 600; line-height: 1.8em;}

main h4 {
    padding: 2px 5px; margin: 0 0 10px;
    background: #c6e5f9;
    color: #004885; font-size: 15px;}

/* アスタリスク */
main .asterisk {position: relative; padding: 0 0 0 20px;}
main .asterisk:before {content:'※'; position: absolute; top: 0; left: 0;}

/* グラデーションリンク */
main a.dis-ilblk {
    box-sizing: border-box; width: 100%; max-width: 300px; position: relative; padding: 12px 40px 12px 15px;
    border: solid 2px #d93766; border-radius: 8px;
    background: linear-gradient(#fd92ae, #ff0049);
    color: #fff; font-size: 15px; font-weight: bold; text-align: center; line-height: 1.0em;
    text-decoration: none;}

main a.dis-ilblk:hover { opacity: 0.7;}

main a.dis-ilblk::before,
main a.dis-ilblk::after {
    content: '';
    display: block; position: absolute;
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	-ms-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;}
    
main a.dis-ilblk::before {
    top: 16px; right: 19px;
    width: 5px; height: 5px;
    border: solid #fff; border-width: 3px 3px 0 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);}

main a.dis-ilblk::after {
    top: 10px; right: 12px;
    width: 16px; height: 16px;
    border: solid 2px #fff; border-radius: 50%;}


/* ワンポイント */
main .dry_point {
    border: solid 1px #FFD200;
    background: #ffffec;}

main .dry_point strong {
    display: block;
    padding: 3px;
    background: #ffe563;
    color: #ff6600;}

main .dry_point .clearfix { padding: 3px;}
main .dry_point .clearfix::before { 
    content: '';
    display: block; float: left;
    width: 36px; height: 58px; margin: 0 15px 10px;
    background: url(../../e/dry-suits_select/images/point.png);
    background-size: 100% auto;}

/**========================================**/
/* ドライスーツとは */
#dry-tsk1 img { width: 350px; margin: 0 20px 10px 0;}

@media screen and (max-width:699px){
    #dry-tsk1 img.lf { 
        display: block; float: none;
        margin: 0 auto 10px;}
}

#dry-tsk1 .asterisk { 
    margin: 5px 0 0; padding: 0 0 0 18px;
    color:#FF0004; font-size: 0.85em;}

/* マリンウェアの種類 */
#dry-tsk1 li { margin: 0 0 15px;}

/**========================================**/
/* タイプ別ドライスーツの特徴 */
#dry-tsk2 img { display: block; width: 500px; margin: 0 auto 10px;}

/**========================================**/
/* 用語解説 */
#dry-tsk3 img:not(:last-of-type) { width: 170px; }
#dry-tsk3 img:last-of-type { width: 185px; }

/**========================================**/
/* インナーウェア */
#dry-tsk5 img { width: 185px; margin: 0 20px 10px 0;}
#dry-tsk5 a.dis-ilblk { margin: 0 5px 15px;}

@media screen and (max-width:399px){
    #dry-tsk5 img.lf { 
        display: block; float: none;
        margin: 0 auto 10px;}
}



/**========================================**/
/* 着用方法 */
#dry-tsk6 div { font-size: 0;}
#dry-tsk6 div p { display: inline-block; position: relative; margin: 0 5px 10px;}
#dry-tsk6 div p::before {
    content: '1';
    display: block; position: absolute; top: 3px; left: 3px;
    box-sizing: border-box; width: 24px; height: 24px; padding: 4px 0 0;
    border-radius: 50%;
    background: #c6e5f9;
    color: #004885; font-size: 16px; font-weight: bold; text-align: center; line-height: 1.0em;}

#dry-tsk6 div p:nth-of-type(1)::before { content: '1';}
#dry-tsk6 div p:nth-of-type(2)::before { content: '2';}
#dry-tsk6 div p:nth-of-type(3)::before { content: '3';}
#dry-tsk6 div p:nth-of-type(4)::before { content: '4';}
#dry-tsk6 div p:nth-of-type(5)::before { content: '5';}
#dry-tsk6 div p:nth-of-type(6)::before { content: '6';}

#dry-tsk6 img { width: 240px; }

/**========================================**/
/* メンテンナンス（使用後のお手入れ）*/
#dry-tsk7-1 p:not(.asterisk) {
    margin: 0 0 5px 20px;
    text-indent: -20px;}

#dry-tsk7-1 .dry_point { margin: 15px 0 0;}
#dry-tsk7-1 .dry_point .clearfix { position: relative; padding: 3px 3px 3px 56px;}
#dry-tsk7-1 .dry_point .clearfix::before { 
    content: '';
    display: block; position: absolute; top: 3px; left: 10px; float: none;
    width: 36px; height: 58px; margin: 0;
    background: url(../../e/dry-suits_select/images/point.png);
    background-size: 100% auto;}

@media screen and (max-width:699px){
    #dry-tsk7-1 .dry_point .clearfix { padding: 3px;}
    #dry-tsk7-1 .dry_point .clearfix::before { display: none;}
}



/* メンテンナンス（保管上の注意事項）*/
#dry-tsk7-2 p {position: relative; margin: 0 0 5px; padding: 0 0 0 20px;}
#dry-tsk7-2 p::before {content:'※'; position: absolute; top: 0; left: 0;}

/**========================================**/
/* ドライスーツの修理 */
#dry-tsk8 a.dis-ilblk { margin: 0 5px 15px;}
#dry-tsk8 img { width: 780px; }

/* その他関連お役立ち講座 */ 
#dry-tsk8 strong {
    display: block;
    margin: 0 0 20px; padding: 0 0 5px; 
    border-bottom: double 5px #004885;
    color: #004885; font-size: 1.2em; font-weight: 600;}

#dry-tsk8 ul.disc {
    list-style: disc;
    padding: 0 0 0 26px;}
    
#dry-tsk8 li { margin: 0 0 10px;}

/**============================================================================================ メインコンテンツ **/
/* LastUp2024.12.02_shinkai */