/******************************************************************************
	Petit FRAME
******************************************************************************/


/* 湘南フレームURL ********************************************************/
var gsDir = "/0img_dc/frame/";

/* 背景色設定クラス名 ********************************************************/
var gsCornerColor = "#FFFFFF";

/********************************************************************************
　ページごとのフレームタイプ
　       00:なし     01:セロファン付き
　       10:フォト   11:セロファン付き
　       20:POLA     21:セロファン付き
　       30:角丸     31:シャドウ＋セロファン付き
　       40:シャドウ 41:セロファン付き
********************************************************************************/
gaFrameType = new Array();
/* 更新エリア { *************************************************/
gaFrameType["banana"]     = "00";
gaFrameType["lime"]       = "00";
gaFrameType["muscat1"]    = "00";
gaFrameType["muscat1b"]   = "00";
gaFrameType["muscat1c"]   = "00";
gaFrameType["muscat2"]    = "00";
gaFrameType["muscat2b"]   = "00";
gaFrameType["muscat2c"]   = "00";
gaFrameType["muscat3"]    = "00";
gaFrameType["orange2"]    = "00";
gaFrameType["lemon2"]     = "00";
gaFrameType["pineapple1"] = "20";
gaFrameType["grape1"]     = "00";
gaFrameType["grape2"]     = "00";
gaFrameType["grape3"]     = "00";
gaFrameType["grape4"]     = "00";
gaFrameType["grape5"]     = "00";
/* } 更新エリア *************************************************/
/*
<--COMMENT_END-->
*/
/******************************************************************************
	プログラム設定　↓↓ここから下はいじらないでください↓↓
******************************************************************************/
var giZIndex = 2;
var giTimer = 500;

/********************************************************************************
	フレームサイズデータ
********************************************************************************/

// 写真フレーム（左上パーツ）情報
var giPhotoFrameWidthLeft = 14;
var giPhotoFrameWidthRight = 14;
var giPhotoFrameHeightTop = 14;
var giPhotoFrameHeightBottom = 15;

// ポラロイド情報
var giPolaFrameWidthLeft = 17;
var giPolaFrameWidthRight = 16;
var giPolaFrameHeightTop = 18;
var giPolaFrameHeightBottom = 58;

// セロファン情報
var giCellWidth = 100;
var giCellHeight = 30;
var giCellHeightHalf = 15;

// シャドウ
var giShadowWidthLeft = 6;
var giShadowWidthRight = 9;
var giShadowHeightTop = 6;
var giShadowHeightBottom = 6;

var giShadowWidthLeftIn = 4;
var giShadowWidthRightIn = 5;
var giShadowHeightTopIn = 4;
var giShadowHeightBottomIn = 2;


// 角丸シャドウ
var giRShadowWidthLeft = 9;
var giRShadowWidthRight = 9;
var giRShadowHeightTop = 6;
var giRShadowHeightBottom = 7;

var giRShadowWidthLeftIn = 7;
var giRShadowWidthRightIn = 5;
var giRShadowHeightTopIn = 4;
var giRShadowHeightBottomIn = 3;


// 写真フレーム（左上パーツ）情報
var giPhotoCornerWidthLeft = 28;
var giPhotoCornerWidthRight = 28;
var giPhotoCornerHeightTop = 28;
var giPhotoCornerHeightBottom = 28;

// マスキングテープ情報
var giMtWidth = 100;
var giMtHeight = 32;
var giMtHeightHalf = 16;

// ピン情報
var giPinWidth = 37;
var giPinHeight = 46;
var giPinHeightHalf = 23;



/******************************************************************************
	関数名		SetShonanFrameTimer
	機能		湘南フレームタイマーを設定する
	
	入力		なし
	出力		なし
	
	処理フロー	1. 1秒後にSetShonanFrameを実行する
******************************************************************************/
function SetShonanFrameTimer(sBgColor){
	var iObjectLength;
	
	// MacIEの場合
	if(CheckBrowserMode() == 3){
		// 何もせずに終了する
		return;
	}
	
	// 現在ページに設定されている湘南フレームタイプを取得する
	var iFrameType = GetFrameType();
	
	// 湘南フレームが設定されていない場合
	if(iFrameType == 0){
		// 何もしないで終了する
		return;
	}
	
	// 画像の高さが取得できなければ SetShonanFrameTimer を再実行
	for( var i = 0; i < document.getElementsByTagName('img').length; i ++ ){
		var target = document.getElementsByTagName('img')[i];
		if(target.className.indexOf('imgbar') > -1){
			if(target.height <= 0){ setTimeout("SetShonanFrameTimer('" + sBgColor +  "')", 100); return; }
		}
	}

	// 湘南オブジェクトリストを作成する
	iObjectLength = SaveShonanFrameObject(iFrameType);
	
	// オブジェクトが存在しない場合
	if(iObjectLength == 0){
		// 何もせずに終了する
		return;
	}
	
	// 湘南フレームをセットする（湘南フレームが存在しない場合は、作成する）
	SetShonanFrame(sBgColor);

	// 湘南フレームをセットするポジション設定するために、もう一度実行
	SetShonanFrame(sBgColor);
	
	// 1秒後にSetShonanFrameを実行する
	window.setInterval("SetShonanFrame('" + sBgColor + "');", giTimer);
}


/********************************************************************************
	関数名		GetFrameType
	機能		現在ページのフレームタイプを
				<body>のidを元に取得する
				
	入力		なし
	出力		iType		フレームタイプ番号
********************************************************************************/
function GetFrameType(){
	// 現在のページを<body>のIDから取得する
	var sPageName = document.getElementsByTagName("BODY")[0].id;
	
	// 対象のページに設定されているフレームタイプ番号を取得する
	var iType = gaFrameType[sPageName];
	
	return iType;
}

/********************************************************************************
	関数名		SaveShonanFrameObject
	機能		ページに含まれる湘南オブジェクトをすべてリストに格納する
	
	入力		sFrameType			フレームタイプ
	G出力		gaShonanObject		湘南オブジェクト
				goLastShonanObject	最後の湘南オブジェクト
	
	出力		iObjectLength		オブジェクト数
	
	処理概要	1. imgbarのオブジェクトを取得する
				2. フレームタイプを各桁に分解する
				3. フレームタイプに対応する湘南クラスを格納する
				4. 湘南クラスに対して繰り返す
				 4.1. 対象のクラスのオブジェクトを配列に追加する
				5. 最後の湘南オブジェクトを返して終了する
********************************************************************************/
gaShonanObjects = new Array();
gaShonanClass = new Array();
var giLastPositionTop;
var giLastPositionLeft;
var goLastShonanObject;
function SaveShonanFrameObject(sFrameType){
	
	var iObjectLength;

	aShonanClass = new Array();
	
	var sImgbarClass = "imgbar";
	var iShonanCnt = 0;
	aClassObjects = new Array();
	var iClassCnt = 0;
	
	// imgbarオブジェクトを取得する
	aClassObjects = document.GetElementsByClass("imgbar");
	
	iObjectLength = aClassObjects.length;
	
	// オブジェクト数がゼロの場合
	if(iObjectLength == 0){
		return iObjectLength;
	}
	
	// フレームタイプに対応するフレーム名を設定する
	aShonanClass = SelectShonanClass(sFrameType);
	
	// 湘南クラスに対して繰り返す
	for(iShonanCnt = 0; iShonanCnt < aShonanClass.length; iShonanCnt++ ){
		// 対象のクラスのオブジェクトを取得する
		// x aClassObjects = document.GetElementsByClass(aShonanClass[iShonanCnt]);
		
		// 対象オブジェクトに対して繰り返す
		for(iClassCnt = 0; iClassCnt < aClassObjects.length; iClassCnt++){
			
			// G配列に対象のクラスオブジェクトリストを追加する
			// gaShonanObjects[gaShonanObjects.length] = aClassObjects[iClassCnt];
			gaShonanObjects[gaShonanObjects.length] = aClassObjects[iClassCnt];
			
			// G配列に対象のクラス名を追加する
			gaShonanClass[gaShonanClass.length] = aShonanClass[iShonanCnt];
			
		}
		
	}
	
	// 最後の湘南オブジェクトの位置をG情報に格納する
	giLastPositionTop = GetObjectPosition(gaShonanObjects[gaShonanObjects.length - 1], "top");
	giLastPositionLeft = GetObjectPosition(gaShonanObjects[gaShonanObjects.length - 1], "left");
	goLastShonanObject = gaShonanObjects[gaShonanObjects.length - 1];
	
	return iObjectLength;
}

/********************************************************************************
	関数名		SelectShonanClass
	機能		フレームタイプにあわせて、湘南フレームのフレームタイプを
				リストに格納して返す。
				
	入力		iFrameType			00:なし　　　　　01:セロファン付き
									10:フォト　　　　11:セロファン付き
									20:POLA　　　　　21:セロファン付き
									30:角丸　　　　　31:シャドウ＋セロファン
									40:シャドウ　　　41:セロファン付き
	出力		aShonanClass
********************************************************************************/
function SelectShonanClass(iFrameType){

	// 返却配列
	aShonanClass = new Array();
	
	// フレームタイプに対応するクラスリストを設定する
	switch(iFrameType){
		// セロファンのみ
		case "01":
			aShonanClass = new Array("ShonanCell");
			break;

		case "02":
			aShonanClass = new Array("maskingtape1");
			break;

		case "03":
			aShonanClass = new Array("maskingtape2");
			break;

		case "04":
			aShonanClass = new Array("maskingtape3");
			break;

		case "05":
			aShonanClass = new Array("pin1");
			break;

		case "06":
			aShonanClass = new Array("pin2");
			break;


		// フォト
		case "10":
			aShonanClass = new Array("ShonanPhoto");
			break;

		// フォト+セロファン
		case "11":
			aShonanClass = new Array("ShonanPhoto", "ShonanPhotoCell");
			break;

		// フォト+マスキングテープ1
		case "12":
			aShonanClass = new Array("ShonanPhoto", "frame_maskingtape1");
			break;

		// フォト+マスキングテープ2
		case "13":
			aShonanClass = new Array("ShonanPhoto", "frame_maskingtape2");
			break;

		// フォト+マスキングテープ3
		case "14":
			aShonanClass = new Array("ShonanPhoto", "frame_maskingtape3");
			break;

		// フォト+ピン1
		case "15":
			aShonanClass = new Array("ShonanPhoto", "frame_pin1");
			break;

		// フォト+ピン2
		case "16":
			aShonanClass = new Array("ShonanPhoto", "frame_pin2");
			break;



		// POLA
		case "20":
			aShonanClass = new Array("ShonanPola");
			break;
		
		// POLA+セロファン
		case "21":
			aShonanClass = new Array("ShonanPola", "ShonanPolaCell");
			break;

		// フォト+マスキングテープ1
		case "22":
			aShonanClass = new Array("ShonanPola", "frame_maskingtape1");
			break;

		// フォト+マスキングテープ2
		case "23":
			aShonanClass = new Array("ShonanPola", "frame_maskingtape2");
			break;

		// フォト+マスキングテープ3
		case "24":
			aShonanClass = new Array("ShonanPola", "frame_maskingtape3");
			break;

		// フォト+ピン1
		case "25":
			aShonanClass = new Array("ShonanPola", "frame_pin1");
			break;

		// フォト+ピン2
		case "26":
			aShonanClass = new Array("ShonanPola", "frame_pin2");
			break;



		// 角丸
		case "30":
			aShonanClass = new Array("ShonanRound2");
			break;
			
		// 角丸シャドウ+セロファン
		case "31":
			aShonanClass = new Array("ShonanRShadow", "ShonanCell");
			break;

		// フォト+マスキングテープ1
		case "32":
			aShonanClass = new Array("ShonanRShadow", "maskingtape1");
			break;

		// フォト+マスキングテープ2
		case "33":
			aShonanClass = new Array("ShonanRShadow", "maskingtape2");
			break;

		// フォト+マスキングテープ3
		case "34":
			aShonanClass = new Array("ShonanRShadow", "maskingtape3");
			break;

		// フォト+ピン1
		case "35":
			aShonanClass = new Array("ShonanRound2", "pin1");
			break;

		// フォト+ピン2
		case "36":
			aShonanClass = new Array("ShonanRound2", "pin2");
			break;



		// シャドウ
		case "40":
			aShonanClass = new Array("ShonanShadow");
			break;
		
		// シャドウ+セロファン
		case "41":
			aShonanClass = new Array("ShonanShadow", "ShonanCell");
			break;

		// フォト+マスキングテープ1
		case "42":
			aShonanClass = new Array("ShonanShadow", "maskingtape1");
			break;

		// フォト+マスキングテープ2
		case "43":
			aShonanClass = new Array("ShonanShadow", "maskingtape2");
			break;

		// フォト+マスキングテープ3
		case "44":
			aShonanClass = new Array("ShonanShadow", "maskingtape3");
			break;

		// フォト+ピン1
		case "45":
			aShonanClass = new Array("ShonanShadow", "pin1");
			break;

		// フォト+ピン2
		case "46":
			aShonanClass = new Array("ShonanShadow", "pin2");
			break;



		// フォトコーナー1
		case "50":
			aShonanClass = new Array("photocorner1");
			break;
		
		// フォトコーナー1+セロファン
		case "51":
			aShonanClass = new Array("photocorner1", "ShonanCell");
			break;

		// フォトコーナー1+マスキングテープ1
		case "52":
			aShonanClass = new Array("photocorner1", "maskingtape1");
			break;

		// フォトコーナー1+マスキングテープ2
		case "53":
			aShonanClass = new Array("photocorner1", "maskingtape2");
			break;

		// フォトコーナー1+マスキングテープ3
		case "54":
			aShonanClass = new Array("photocorner1", "maskingtape3");
			break;

		// フォトコーナー1+ピン1
		case "55":
			aShonanClass = new Array("photocorner1", "pin1");
			break;

		// フォトコーナー1+ピン2
		case "56":
			aShonanClass = new Array("photocorner1", "pin2");
			break;



		// フォトコーナー2
		case "60":
			aShonanClass = new Array("photocorner2");
			break;
		
		// フォトコーナー2+セロファン
		case "61":
			aShonanClass = new Array("photocorner2", "ShonanCell");
			break;

		// フォトコーナー2+マスキングテープ1
		case "62":
			aShonanClass = new Array("photocorner2", "maskingtape1");
			break;

		// フォトコーナー2+マスキングテープ2
		case "63":
			aShonanClass = new Array("photocorner2", "maskingtape2");
			break;

		// フォトコーナー2+マスキングテープ3
		case "64":
			aShonanClass = new Array("photocorner2", "maskingtape3");
			break;

		// フォトコーナー2+ピン1
		case "65":
			aShonanClass = new Array("photocorner2", "pin1");
			break;

		// フォトコーナー2+ピン2
		case "66":
			aShonanClass = new Array("photocorner2", "pin2");
			break;



		default:
			aShonanClass = new Array();
	}
	
	return aShonanClass;
	
}


/******************************************************************************
	関数名		SetShonanFrame
	機能		湘南フレームクラスに対して湘南フレームをセットする
	
	入力		sBgColor	背景色設定クラス名
				bInitFlg	はじめての起動フラグ(1:初期起動 0:2回目以降）
	出力		なし
	
	処理概要	・対象オブジェクトに対するフレームが設定されていない場合は
				　フレームオブジェクトを生成する
				・対象フレームを対象オブジェクトにマッチさせる
				
	処理フロー	0. 2回目以降の処理の場合
				 0.1. 最後の湘南オブジェクトの位置を取得する
				 0.2. 前回のチェック位置と同じ場合
				  0.2.1. 終了する
				1. 湘南オブジェクトリストに対して繰り返す
				 1.1. 対象の湘南フレームが存在しない場合
				  2.1.1. 対象オブジェクト配列に対してMakeObjectFrameを実行する
******************************************************************************/
// 初回フラグ
var gbInitFlg = 1;
// 動いていないカウンタ
var giNoMoveCnt = 0;
function SetShonanFrame(sCornerColor){
	
	// 最終オブジェクト位置
	var iLastPositionTop, iLastPositionLeft;
	
	// カウンタ
	var iObjectCnt = 0;
	
	// 湘南フレームID
	var sShonanId;
	
	var iObjectsCnt;
	var sFrameObjectName;
	var oFrameObject;
	
	
	// 2回目以降の処理の場合
	if(gbInitFlg != 1){

		// 最後の湘南オブジェクトの位置を取得する
		iLastPositionTop = GetObjectPosition(goLastShonanObject, "top");
		iLastPositionLeft = GetObjectPosition(goLastShonanObject, "left");
		
		// 前回チェックしたときと、位置が等しい場合
		if (iLastPositionTop == giLastPositionTop && iLastPositionLeft == giLastPositionLeft){
			
			// 3回連続で動いていない場合
			if(giNoMoveCnt >= 3){
				// 何もしないで終了する
				return;
			} else {
				// 動いていないカウンタをインクリメントする
				giNoMoveCnt++;
			}
		// 前回と位置が異なる場合
		} else {
			// 動いていないカウンタを初期化する
			giNoMoveCnt = 0;
			
			// 最終位置を更新する
			giLastPositionTop = iLastPositionTop;
			giLastPositionLeft = iLastPositionLeft;
			
			// 画像サイズを調整する
			
		}
		
	}
	
	// 湘南オブジェクトリストに対して繰り返す
	for(iObjectsCnt = 0; iObjectsCnt < gaShonanObjects.length; iObjectsCnt++){

		// 対象の湘南フレームIDを作成する
		sShonanId = "Shonan_" + iObjectsCnt;
		sShonanTopId = "Shonan_" + iObjectsCnt + "_Top";

		// 対象の湘南フレームが存在する場合（sShonanTopIdは、フレーム用。sShonanIdはアクセサリー用）
		if(document.getElementById(sShonanTopId) || document.getElementById(sShonanId)){
			
			// 対象オブジェクト用のフレームをオブジェクトにマッチさせる
			SetFramePosition(gaShonanObjects[iObjectsCnt], sShonanId, gaShonanClass[iObjectsCnt]);
			
			// 角丸シャドウの場合
			if(gaShonanClass[iObjectsCnt] == "ShonanRShadow"){
				// 角丸オブジェクト名を作成する
				sShonanId = sShonanId + "R";
				
				// 角丸もマッチさせる
				SetFramePosition(gaShonanObjects[iObjectsCnt], sShonanId, "ShonanRound2");
			}
		// 対象の湘南フレームが存在しない場合
		} else {
		
			
			// safariの場合
			if(CheckBrowserMode() == 2){
				// 対象画像がダウンロード済みの場合
				if(gaShonanObjects[iObjectsCnt].width > 10){
					
					// フレームオブジェクトを作成する
					MakeFrame(gaShonanObjects[iObjectsCnt], gaShonanClass[iObjectsCnt], sCornerColor, sShonanId);
				}
				
			// Safari以外のブラウザの場合(img.completeがundefinedでないブラウザの場合）
			} else {
				// 対象画像がダウンロード済みの場合
				if(gaShonanObjects[iObjectsCnt].complete == true){
					
					// フレームオブジェクトを作成する
					MakeFrame(gaShonanObjects[iObjectsCnt], gaShonanClass[iObjectsCnt], sCornerColor, sShonanId);
				}
			}

		}
	}
	gbInitFlg = 0;
	
	return;
}


/******************************************************************************
	関数名		MakeFrame
	機能		フレームを作成する
	
	入力		oElement		対象オブジェクト
				sClassName		クラス名
				sCornerColor	背景色
				sFrameId		フレームオブジェクト名
	出力		なし
	G出力		oDiv			divオブジェクト
	
	処理概要	1. 角丸の場合
				 1.1. 角丸オブジェクトを出力する
				2. フレームの場合
				 2.1. フレームオブジェクトを出力する
******************************************************************************/
function MakeFrame(oElement, sClassName, sCornerColor, sFrameId){
	var iRoundNum;
	
	// 角丸の場合 ****************************************
	if(sClassName.search(/ShonanRound/) == 0){
		// 角丸番号を取得する
		iRoundNum = sClassName.substr(11,1);
		// 角丸を表示する
		StyleRound(oElement, sCornerColor, iRoundNum, sFrameId);


	// 写真フレームの場合 ****************************************
	} else if (sClassName == "ShonanPhoto"){
		// 写真フレームを表示する
		StyleFrame(oElement, "ShonanPhoto", sCornerColor, sFrameId);


	// POLAフレームの場合
	} else if (sClassName == "ShonanPola"){
		// POLAフレームを表示する
		StyleFrame(oElement, "ShonanPola", sCornerColor, sFrameId);


	// シャドウフレームの場合
	} else if (sClassName == "ShonanShadow"){
		// シャドウフレームを表示する
		StyleFrame(oElement, "ShonanShadow", sCornerColor, sFrameId);


	// 角丸シャドウフレームの場合
	} else if (sClassName == "ShonanRShadow"){
		// 角丸を表示する
		iRoundNum = 2;
		sFrameRoundId = sFrameId + "R";
		// 角丸を表示する
		StyleRound(oElement, sCornerColor, iRoundNum, sFrameRoundId);
		
		// 角丸シャドウフレームを表示する
		StyleFrame(oElement, "ShonanRShadow", sCornerColor, sFrameId);


	// フォトコーナー1の場合
	} else if (sClassName == "photocorner1"){
		// POLAフレームを表示する
		StyleFrame(oElement, "photocorner1", sCornerColor, sFrameId);


	// フォトコーナー2の場合
	} else if (sClassName == "photocorner2"){
		// POLAフレームを表示する
		StyleFrame(oElement, "photocorner2", sCornerColor, sFrameId);


	// セロファンの場合 ****************************************
	} else if (sClassName == "ShonanCell"){
		// セロファンを表示する
		ShowAccessory(oElement, "ShonanCell", sFrameId);

	// PHOTOセロファンの場合
	} else if (sClassName == "ShonanPhotoCell"){
		// セロファンを表示する
		ShowAccessory(oElement, "ShonanPhotoCell", sFrameId);

	// POLAセロファンの場合
	} else if (sClassName == "ShonanPolaCell"){
		// セロファンを表示する
		ShowAccessory(oElement, "ShonanPolaCell", sFrameId);
	}

	// マスキングテープの場合
	else if (sClassName == "maskingtape1" || sClassName == "maskingtape2" || sClassName == "maskingtape3"){
		ShowAccessory(oElement, sClassName, sFrameId);
	}
	else if (sClassName == "frame_maskingtape1" || sClassName == "frame_maskingtape2" || sClassName == "frame_maskingtape3"){
		ShowAccessory(oElement, sClassName, sFrameId);
	}


	// マスキングテープの場合
	else if (sClassName == "pin1" || sClassName == "pin2" || sClassName == "frame_pin1" || sClassName == "frame_pin2"){
		ShowAccessory(oElement, sClassName, sFrameId);
	}

}

/******************************************************************************
	関数名		SetFramePosition
	機能		フレームオブジェクトを対象のオブジェクトにフィットさせる
	
	入力		oElement		対象オブジェクト
				sFrameId		フレームオブジェクトID（"_Top"などが付かない状態）
				sShonanClass	湘南フレームクラス名
	出力		なし
	
	処理概要	1. 対象オブジェクトの位置を取得する
				2. フレームオブジェクトの位置を移動する
				
	画像情報	セロファン画像サイズ： 152 * 42
				ポラロイド tl		： 17 * 18
*******************************************************************************/
function SetFramePosition(oElement, sFrameId, sShonanClass){

	// 対象オブジェクトの位置を取得する
	var iTop = GetObjectPosition(oElement, "top");
	var iLeft = GetObjectPosition(oElement, "left");
	
	
	// 角丸の場合
	if(sShonanClass.search(/ShonanRound/) == 0){

		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");

		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameLeftHeight = oLeftObject.offsetHeight;

		// トップとボトムのオブジェクト位置を作成する
		var iTop_top = iTop;
		var iTop_left = iLeft;
		var iBottom_top = iTop + iFrameTopHeight + iFrameLeftHeight;
		
		// フレーム位置を移動する
		oTopObject.style.top = iTop_top + "px";
		oTopObject.style.left = iTop_left + "px";

		oBottomObject.style.top =  iBottom_top + "px";
		oBottomObject.style.left = iTop_left + "px";


	// Photoの場合
	} else if(sShonanClass == "ShonanPhoto"){
		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");
		var oRightObject = document.getElementById(sFrameId + "_Right");
		
		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameTopWidth = oTopObject.offsetWidth;
		var iFrameLeftHeight = oLeftObject.offsetHeight;


		// 位置を調整する
		var iTop_top = iTop - giPhotoFrameHeightTop;
		var iTop_left = iLeft - giPhotoFrameWidthLeft;
		var iLeft_top = iTop_top + iFrameTopHeight;
		var iRight_left = iTop_left + iFrameTopWidth - giPhotoFrameWidthRight;
		var iBottom_top = iTop_top + iFrameTopHeight + iFrameLeftHeight;
		
		// フレーム位置を移動する
		oTopObject.style.top = iTop_top + "px";
		oTopObject.style.left = iTop_left + "px";

		oBottomObject.style.top =  iBottom_top + "px";
		oBottomObject.style.left = iTop_left + "px";

		oLeftObject.style.top =  iLeft_top + "px";
		oLeftObject.style.left = iTop_left + "px";

		oRightObject.style.top =  iLeft_top + "px";
		oRightObject.style.left = iRight_left + "px";


	// POLAの場合
	} else if (sShonanClass == "ShonanPola"){

		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");
		var oRightObject = document.getElementById(sFrameId + "_Right");
		
		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameTopWidth = oTopObject.offsetWidth;
		var iFrameLeftHeight = oLeftObject.offsetHeight;
		
		// 位置を調整する（重なり1px分ずらす）
		var iTop_top = iTop - giPolaFrameHeightTop + 1;
		var iTop_left = iLeft - giPolaFrameWidthLeft;
		var iLeft_top = iTop_top + iFrameTopHeight;
		var iRight_left = iTop_left + iFrameTopWidth - giPolaFrameWidthRight;
		var iBottom_top = iTop_top + iFrameTopHeight + iFrameLeftHeight;
		
		// フレーム位置を移動する
		oTopObject.style.top = iTop_top + "px";
		oTopObject.style.left = iTop_left + "px";

		oBottomObject.style.top =  iBottom_top + "px";
		oBottomObject.style.left = iTop_left + "px";

		oLeftObject.style.top =  iLeft_top + "px";
		oLeftObject.style.left = iTop_left + "px";

		oRightObject.style.top =  iLeft_top + "px";
		oRightObject.style.left = iRight_left + "px";


	// シャドウの場合
	} else if (sShonanClass == "ShonanShadow"){
		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");
		var oRightObject = document.getElementById(sFrameId + "_Right");

		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameTopWidth = oTopObject.offsetWidth;
		var iFrameLeftHeight = oLeftObject.offsetHeight;


		// 位置を調整する（重なり分ずらす）
		var iTop_top = iTop - giShadowHeightTop + giShadowHeightTopIn;
		var iTop_left = iLeft - giShadowWidthLeft + giShadowWidthLeftIn;
		var iLeft_top = iTop_top + iFrameTopHeight;
		var iRight_left = iTop_left + iFrameTopWidth - giShadowWidthRight;
		var iBottom_top = iTop_top + iFrameTopHeight + iFrameLeftHeight;
		
		// フレーム位置を移動する
		oTopObject.style.top = iTop_top + "px";
		oTopObject.style.left = iTop_left + "px";

		oBottomObject.style.top =  iBottom_top + "px";
		oBottomObject.style.left = iTop_left + "px";

		oLeftObject.style.top =  iLeft_top + "px";
		oLeftObject.style.left = iTop_left + "px";

		oRightObject.style.top =  iLeft_top + "px";
		oRightObject.style.left = iRight_left + "px";


	// 角丸シャドウの場合
	} else if (sShonanClass == "ShonanRShadow"){
		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");
		var oRightObject = document.getElementById(sFrameId + "_Right");
		
		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameTopWidth = oTopObject.offsetWidth;
		var iFrameLeftHeight = oLeftObject.offsetHeight;

		// 位置を調整する（重なり分ずらす）
		var iTop_top = iTop - giRShadowHeightTop + giRShadowHeightTopIn;
		var iTop_left = iLeft - giRShadowWidthLeft + giRShadowWidthLeftIn;
		var iLeft_top = iTop_top + iFrameTopHeight;
		var iRight_left = iTop_left + iFrameTopWidth - giRShadowWidthRight;
		var iBottom_top = iTop_top + iFrameTopHeight + iFrameLeftHeight;

		// フレーム位置を移動する
		oTopObject.style.top = iTop_top + "px";
		oTopObject.style.left = iTop_left + "px";

		oBottomObject.style.top =  iBottom_top + "px";
		oBottomObject.style.left = iTop_left + "px";

		oLeftObject.style.top =  iLeft_top + "px";
		oLeftObject.style.left = iTop_left + "px";

		oRightObject.style.top =  iLeft_top + "px";
		oRightObject.style.left = iRight_left + "px";


	// フォトコーナーの場合
	} else if(sShonanClass == "photocorner1" || sShonanClass == "photocorner2"){

		// 各フレームオブジェクトを取得する
		var oTopObject = document.getElementById(sFrameId + "_Top");
		var oBottomObject = document.getElementById(sFrameId + "_Bottom");
		var oLeftObject = document.getElementById(sFrameId + "_Left");
		var oRightObject = document.getElementById(sFrameId + "_Right");

		// 各パーツの高さや横幅を取得する
		var iFrameTopHeight = oTopObject.offsetHeight;
		var iFrameTopWidth = oTopObject.offsetWidth;
		var iFrameLeftHeight = oLeftObject.offsetHeight;


		// 位置を調整する
		var iTop_top = iTop;
		var iTop_left = iLeft;
		var iLeft_top = iTop_top + iFrameTopHeight;
		var iRight_left = iTop_left + iFrameTopWidth - giPhotoCornerWidthRight;
		var iBottom_top = iTop_top + iFrameTopHeight + iFrameLeftHeight;

        if(sShonanClass == "photocorner1"){
    		// フレーム位置を移動する
    		oTopObject.style.top = (iTop_top - 2) + "px";
    		oTopObject.style.left = (iTop_left - 2 ) + "px";

    		oBottomObject.style.top =  (iBottom_top + 2) + "px";
    		oBottomObject.style.left = (iTop_left - 2) + "px";

    		oLeftObject.style.top =  iLeft_top + "px";
    		oLeftObject.style.left = iTop_left + "px";

    		oRightObject.style.top =  iLeft_top + "px";
    		oRightObject.style.left = iRight_left + "px";
    	}
    	else {
    		// フレーム位置を移動する
    		oTopObject.style.top = (iTop_top - 3) + "px";
    		oTopObject.style.left = (iTop_left - 3 ) + "px";

    		oBottomObject.style.top =  (iBottom_top + 3) + "px";
    		oBottomObject.style.left = (iTop_left - 3) + "px";

    		oLeftObject.style.top =  iLeft_top + "px";
    		oLeftObject.style.left = iTop_left + "px";

    		oRightObject.style.top =  iLeft_top + "px";
    		oRightObject.style.left = iRight_left + "px";
        }


	// セロファン
	} else if (sShonanClass == "ShonanCell"){
		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// アクセサリーのポジションを算出する
		iTop = iTop - giCellHeightHalf;
		iLeft = iLeft + oElement.width / 2 - giCellWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";


	// フォト用セロファン
	} else if (sShonanClass == "ShonanPhotoCell"){
		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の高さ + フォトフレーム高さ（幅)
		iTop = iTop - giCellHeightHalf - giPhotoFrameHeightTop;
		iLeft = iLeft + oElement.width / 2 - giCellWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";


	// POLA用セロファン
	} else if (sShonanClass == "ShonanPolaCell"){
		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の幅 + POLA内側のシャドウ1px分
		iLeft = iLeft + oElement.width / 2 - giCellWidth / 2 + 1;
		
		// セロファン + ポラロイド高 + さPOLA内側のシャドウ1px分
		iTop = iTop - giCellHeightHalf - giPolaFrameHeightTop + 1;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";

	}
	
	
	// マスキングテープ
	else if (sShonanClass == "maskingtape1" || sShonanClass == "maskingtape2" || sShonanClass == "maskingtape3"){

		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の高さ + フォトフレーム高さ（幅)
		iTop = iTop - giCellHeightHalf;
		iLeft = iLeft + oElement.width / 2 - giCellWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";
    }

	// マスキングテープ
	else if (sShonanClass == "frame_maskingtape1" || sShonanClass == "frame_maskingtape2" || sShonanClass == "frame_maskingtape3"){

		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の高さ + フォトフレーム高さ（幅)
		iTop = iTop - giCellHeightHalf - giPhotoFrameHeightTop;
		iLeft = iLeft + oElement.width / 2 - giCellWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";
    }


	// ピン
	else if (sShonanClass == "pin1" || sShonanClass == "pin2"){

		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の高さ + フォトフレーム高さ（幅)
		iTop = iTop - giCellHeightHalf;
		iLeft = iLeft + oElement.width / 2 - giPinWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";
    }

	else if (sShonanClass == "frame_pin1" || sShonanClass == "frame_pin2"){

		// 各フレームオブジェクトを取得する
		var oAccessoryObject = document.getElementById(sFrameId);
		
		// セロファンの半分の高さ + フォトフレーム高さ（幅)
		iTop = iTop - giCellHeightHalf - giPhotoFrameHeightTop;
		iLeft = iLeft + oElement.width / 2 - giPinWidth / 2;
		
		oAccessoryObject.style.top = iTop + "px";
		oAccessoryObject.style.left = iLeft + "px";
    }

}

/********************************************************************************
	関数名		GetObjectPosition
	機能		対象オブジェクトの位置を取得する
	
	入力		oObject	対象オブジェクト
				sMode	取得座標 (top|left)
********************************************************************************/
function GetObjectPosition( oObject, sMode ) {
	var iLeft = 0;
	var iTop = 0;
	var sPosition = "";
	
	
	while( oObject.offsetParent != null ) {
		iLeft += oObject.offsetLeft;
		iTop += oObject.offsetTop;
		oObject = oObject.offsetParent;
	}
	iLeft += oObject.offsetLeft;
	iTop += oObject.offsetTop;
	
	// Left座標を取得する場合
	if(sMode == "left" || sMode == "LEFT"){
		return iLeft;
	} else {
		return iTop;
	}
}

/********************************************************************************
	関数名		ShowRoundPixel
	機能		角丸用のピクセルを表示する
	
	入力		sCornerColor		背景色を設定したクラス名
				iRoundType			角サイズモード
				iTop				ポジション
				iBottom				ポジション
				iWidth				画像横幅
				iHeight				画像高さ
				sId					オブジェクト名
	出力		なし
	
	リンク反映バージョンアップ
				角丸オブジェクトをヘッダー、フッター、二つのDIVにわけ
				ポジション指定も、２つのDIVオブジェクトを同時に設定する仕様に変更する。
********************************************************************************/
function ShowRoundPixel(sCornerColor, iRoundType, iWidth, iHeight, sId){
	var sHtml = "";
	var oTopDiv = document.createElement('div');
	var oBottomDiv = document.createElement('div');
	var oLeftDiv = document.createElement('div');
	oTopDiv.id = sId + "_Top";
	oBottomDiv.id = sId + "_Bottom";
	oLeftDiv.id = sId + "_Left";
	
	var iInnerWidth, iInnerHeight;
	var iRoundSize;
	
	// 表示オブジェクトの位置を設定する
	oTopDiv.style.top = "-1000px";
	oTopDiv.style.left = "-1000px";
	oTopDiv.style.position = "absolute";
	oTopDiv.style.zIndex = giZIndex;
	giZIndex++;
	oLeftDiv.style.top = "-1000px";
	oLeftDiv.style.left = "-1000px";
	oLeftDiv.style.position = "absolute";
	oLeftDiv.style.zIndex = giZIndex;
	giZIndex++;
	oBottomDiv.style.top = "-1000px";
	oBottomDiv.style.left = "-1000px";
	oBottomDiv.style.position = "absolute";
	oBottomDiv.style.zIndex = giZIndex;
	giZIndex++;
	
	// 角サイズ1の場合
	if(iRoundType == 1){
		
		// 角丸サイズを設定する
		iRoundSize = 1;
		// 画像のフレーム抜き横幅、高さを作成する
		iInnerWidth = iWidth - iRoundSize * 2;
		iInnerHeight = iHeight - iRoundSize * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + "; width:1px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		
		// 出力DIVの中にテーブルを挿入する
		oTopDiv.innerHTML = sHtml;
		
		oLeftDiv.innerHTML = "<img src='" + gsDir + "space.gif' width=1 height=" + iInnerHeight + ">";		oLeftDiv.innerHTML = "<img src='" + gsDir + "space.gif' width=1 height=" + iInnerHeight + ">";
		
		sHtml = "";
		sHtml += "<table cellpadding=0 cellspacing=0 border=0>";
		sHtml += "<tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		oBottomDiv.innerHTML = sHtml;

	// 角サイズ2の場合
	} else if(iRoundType == 2){
		
		// 角丸サイズを設定する
		iRoundSize = 3;
		
		// 画像のフレーム抜き高さを作成する
		iInnerHeight = iHeight - iRoundSize * 2;
		
		
		// 3px * 1px
		iInnerWidth = iWidth - 3 * 2;
		sHtml += "<div><table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:3px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:3px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table></div>";
		
		// 1px * 2px
		iInnerWidth = iWidth - 1 * 2;
		sHtml += "<div><table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px;height:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table></div>";

		// 出力DIVの中にテーブルを挿入する
		oTopDiv.innerHTML = sHtml;
		oLeftDiv.innerHTML = "<div style='width:1px;height:" + iInnerHeight + "'><img src='" + gsDir + "space.gif' width=1 height=1></div>";
		
		// 1px * 2px
		iInnerWidth = iWidth - 1 * 2;
		sHtml = "";
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px;height:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";

		// 3px * 1px
		iInnerWidth = iWidth - 3 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:3px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:3px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";

		oBottomDiv.innerHTML = sHtml;

	// 角サイズ3の場合
	} else if(iRoundType == 3){
		// 角丸サイズを設定する
		iRoundSize = 4;
		// 画像のフレーム抜き高さを作成する
		iInnerHeight = iHeight - iRoundSize * 2;


		// 4px * 1px
		iInnerWidth = iWidth - 4 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:4px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:4px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";

		// 2px * 1px
		iInnerWidth = iWidth - 2 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:2px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		
		// 1px * 2px
		iInnerWidth = iWidth - 1 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px;height:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		
		// 出力DIVの中にテーブルを挿入する
		oTopDiv.innerHTML = sHtml;
		oLeftDiv.innerHTML = "<div style='width:1px;height:" + iInnerHeight + "'><img src='" + gsDir + "space.gif' width=1 height=1></div>";
		
		// 1px * 2px
		iInnerWidth = iWidth - 1 * 2;
		sHtml = "";
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px;height:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		
		// 2px * 1px
		iInnerWidth = iWidth - 2 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:2px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:2px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		
		// 4px * 1px
		iInnerWidth = iWidth - 4 * 2;
		sHtml += "<table cellpadding=0 cellspacing=0 border=0><tr>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:4px;height:1px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='width:" + iInnerWidth + "'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "<td style='background-color:" + sCornerColor + ";width:4px'><img src='" + gsDir + "space.gif' width=1 height=1></td>";
		sHtml += "</tr></table>";
		oBottomDiv.innerHTML = sHtml;

	}
	
	// bodyの中にオブジェクトを追加する
	document.getElementsByTagName("body")[0].appendChild(oTopDiv);
	document.getElementsByTagName("body")[0].appendChild(oBottomDiv);
	document.getElementsByTagName("body")[0].appendChild(oLeftDiv);
}



/********************************************************************************
	関数名		StyleRound
	機能		対象の画像に角丸を設定する
	
	入力		oImage				画像オブジェクト
				sCornerColor		背景色設定クラス
				iRoundType			角丸の度合い(1:1px|2:3px|3:4px)
				sId					フレームオブジェクトID
	出力		なし
	
	処理概要	1. 対象画像の横幅・高さを取得する
				2. 対象画像のポジションを取得する
				3. 角丸HTMLを表示する
********************************************************************************/
function StyleRound(oImage, sCornerColor, iRoundType, sId){
	var iWidth, iHeight;
	var iTop, iLeft;
	var iRoundSize = 0;
	
	// 対象画像サイズを取得する
	iWidth = oImage.width;
	iHeight = oImage.height;
	
	// 角丸HTMLを表示する
	ShowRoundPixel(sCornerColor, iRoundType, iWidth, iHeight, sId);
}


/********************************************************************************
	関数名		StyleFrame
	機能		対象の画像にフレームを設定する
	
	入力		oImage			画像オブジェクト
				sClass			フレームモード(ShonanPola/ShonanPhoto/ShonanShadow)
				sCornerColor	背景色
				sId				ID名
	出力		なし
	
	処理概要	1. 対象画像の横幅・高さを取得する
				2. 対象画像のポジションを取得する
				3. 角丸HTMLを表示する
********************************************************************************/
function StyleFrame(oImage, sClass, sCornerColor, sId){
	var iWidth, iHeight;
	var iFrameTop;
	var iFrameLeft;
	
	// 対象画像サイズを取得する
	iWidth = oImage.width;
	iHeight = oImage.height;
	
	// フレームのサイズ分のマージンを設定する
	SetFrameMargin(oImage, sClass);
	
	// 角丸HTMLを表示する
	ShowFrame(iWidth, iHeight, sClass, sCornerColor, sId);
}



/********************************************************************************
	関数名		SetFrameMargin
	機能		対象の画像にフレームに適したマージンを設定する
	
	入力		oImage		イメージオブジェクト
				sClass		フレームクラス
	G入力		フレームサイズのグローバル変数 giPhotoFrameHeightTop など
	出力		なし
********************************************************************************/
function SetFrameMargin(oImage, sClass){

	// フレームモードがPOLAの場合
	if(sClass == "ShonanPola"){
		iMarginTop = giPolaFrameHeightTop;
		iMarginBottom = giPolaFrameHeightBottom;
		iMarginLeft = giPolaFrameWidthLeft;
		iMarginRight = giPolaFrameWidthRight;


	// フレームモードがPHOTOの場合
	} else if(sClass == "ShonanPhoto"){
		
		iMarginTop = giPhotoFrameHeightTop;
		iMarginBottom = giPhotoFrameHeightBottom;
		iMarginLeft = giPhotoFrameWidthLeft;
		iMarginRight = giPhotoFrameWidthRight;

	} else if(sClass == "ShonanShadow"){
		iMarginTop = 0;
		iMarginBottom = 0;
		iMarginLeft = 0;
		iMarginRight = 0;

	} else if(sClass == "ShonanRShadow"){
		iMarginTop = 0;
		iMarginBottom = 0;
		iMarginLeft = 0;
		iMarginRight = 0;
		
	}


	// フレームモードがフォトコーナーの場合
	else if(sClass == "photocorner1" || sClass == "photocorner2"){
		iMarginTop = 0;
		iMarginBottom = 0;
		iMarginLeft = 0;
		iMarginRight = 0;
	}


	// オブジェクトにマージンを設定します
	oImage.style.marginTop = iMarginTop + "px";
	oImage.style.marginBottom = iMarginBottom + "px";
	oImage.style.marginLeft = iMarginLeft + "px";
	oImage.style.marginRight = iMarginRight + "px";
	
	return;
}


/********************************************************************************
	関数名		ShowFrame
	機能		フレームテーブルを表示する
	
	入力
				iWidth		横幅
				iHeight		高さ
				sClass		フレームクラス
				sCornerColor	背景色クラス
				sId			ID名
	出力		なし
********************************************************************************/
function ShowFrame(iWidth, iHeight, sClass, sCornerColor, sId){
	var sHtml = "";
	var oTopDiv = document.createElement('div');
	var oBottomDiv = document.createElement('div');
	var oLeftDiv = document.createElement('div');
	var oRightDiv = document.createElement('div');
	
	
	var iMainHeight, iMainWidth;
	var bWinIe = CheckBrowserMode();
	var iRTop, iRLeft;
	
	// 各オブジェクトのステータスを設定する
	oTopDiv.id = sId + "_Top";
	oTopDiv.style.top = "-1000px";
	oTopDiv.style.left = "-1000px";
	oTopDiv.style.position = "absolute";
	oTopDiv.style.zIndex = giZIndex;
	giZIndex++;

	oBottomDiv.id = sId + "_Bottom";
	oBottomDiv.style.top = "-1000px";
	oBottomDiv.style.left = "-1000px";
	oBottomDiv.style.position = "absolute";
	oBottomDiv.style.zIndex = giZIndex;
	giZIndex++;

	oLeftDiv.id = sId + "_Left";
	oLeftDiv.style.top = "-1000px";
	oLeftDiv.style.left = "-1000px";
	oLeftDiv.style.position = "absolute";
	oLeftDiv.style.zIndex = giZIndex;
	giZIndex++;

	oRightDiv.id = sId + "_Right";
	oRightDiv.style.top = "-1000px";
	oRightDiv.style.left = "-1000px";
	oRightDiv.style.position = "absolute";
	oRightDiv.style.zIndex = giZIndex;
	giZIndex++;


	// フォトの場合 ********************************************************************************
	if(sClass == "ShonanPhoto"){
		iMainHeight = iHeight;
		iMainWidth = iWidth;
		iAllWidth = iWidth + giPhotoFrameWidthLeft + giPhotoFrameWidthRight;
		
		if(bWinIe == 1){
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoFrameHeightTop + 'px;width:' + giPhotoFrameWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_tl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_tc.png\', sizingMethod=\'crop\');"></td>';
			sHtml += ' <td style="width:' + giPhotoFrameWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoFrameWidthLeft + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_ml.png\', sizingMethod=\'crop\');"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoFrameWidthRight + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_mr.png\', sizingMethod=\'crop\');"></div>';
			
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoFrameHeightBottom + 'px;width:' + giPhotoFrameWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_bl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_bc.png\', sizingMethod=\'crop\');"></td>';
			sHtml += ' <td style="width:' + giPhotoFrameWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photo_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoFrameHeightTop + 'px;width:' + giPhotoFrameWidthLeft + 'px;background-image:url(' + gsDir + 'photo_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'photo_tc.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + giPhotoFrameWidthRight + 'px;background-image:url(' + gsDir + 'photo_tr.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';

			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoFrameWidthLeft + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'photo_ml.png);background-repeat:no-repeat"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoFrameWidthRight + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'photo_mr.png);background-repeat:no-repeat"></td>';

			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoFrameHeightBottom + 'px;width:' + giPhotoFrameWidthLeft + 'px;background-image:url(' + gsDir + 'photo_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'photo_bc.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + giPhotoFrameWidthRight + 'px;background-image:url(' + gsDir + 'photo_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}


	/* POLA ******************************************************************************/
	} else if(sClass == "ShonanPola"){
		// 内側の1pxは重なるため 1px削る
		iMainHeight = iHeight - 2;
		iMainWidth = iWidth - 2;
		// 全体 + フレーム幅 - 内シャドウ(1)
		iAllWidth = iWidth + giPolaFrameWidthLeft + giPolaFrameWidthRight - 2;
		
		if(bWinIe == 1){
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPolaFrameHeightTop + 'px;width:' + giPolaFrameWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_tl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_tc.png\', sizingMethod=\'crop\');"></td>';
			sHtml += ' <td style="width:' + giPolaFrameWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;

			oLeftDiv.innerHTML = '<div style="width:' + giPolaFrameWidthLeft + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_ml.png\', sizingMethod=\'crop\');"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giPolaFrameWidthRight + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_mr.png\', sizingMethod=\'crop\');"></div>';


			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPolaFrameHeightBottom + 'px;width:' + giPolaFrameWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_bl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_bc.png\', sizingMethod=\'crop\');"></td>';
			sHtml += ' <td style="width:' + giPolaFrameWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'pola_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml += '<table cellspacing=0 cellpadding=0>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPolaFrameHeightTop + 'px;width:' + giPolaFrameWidthLeft + 'px;background-image:url(' + gsDir + 'pola_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'pola_tc.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + giPolaFrameWidthRight + 'px;background-image:url(' + gsDir + 'pola_tr.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;

			oLeftDiv.innerHTML = '<div style="width:' + giPolaFrameWidthLeft + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'pola_ml.png);background-repeat:no-repeat"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giPolaFrameWidthRight + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'pola_mr.png);background-repeat:no-repeat"></td>';

			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPolaFrameHeightBottom + 'px;width:' + giPolaFrameWidthLeft + 'px;background-image:url(' + gsDir + 'pola_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'pola_bc.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + giPolaFrameWidthRight + 'px;background-image:url(' + gsDir + 'pola_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}


	// SHADOW ******************************************************************************
	} else if(sClass == "ShonanShadow"){
		
		// 画像幅 + 左シャドウ + 右シャドウ - 左重なり - 右重なり;
		iAllWidth = iWidth + giShadowWidthLeft + giShadowWidthRight - giShadowWidthLeftIn - giShadowWidthRightIn;
		
		// 画像高さ + 上シャドウ + 下シャドウ - 上重なり - 下重なり;
		iAllHeight = iHeight + giShadowHeightTop + giShadowHeightBottom - giShadowHeightTopIn - giShadowHeightBottomIn;
		
		// センター幅
		iMainWidth = iWidth - giShadowWidthLeftIn - giShadowWidthRightIn;
		iMainHeight = iHeight - giShadowHeightTopIn - giShadowHeightBottomIn;
		
		if(bWinIe == 1){
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giShadowHeightTop + 'px;width:' + giShadowWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_tl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_tc.png\', sizingMethod=\'scale\' );"></td>';
			sHtml += ' <td style="width:' + giShadowWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;

			oLeftDiv.innerHTML = '<div style="width:' + giShadowWidthLeft + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_ml.png\', sizingMethod=\'scale\');"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giShadowWidthRight + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_mr.png\', sizingMethod=\'scale\');"></div>';


			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giShadowHeightBottom + 'px;width:' + giShadowWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_bl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_bc.png\', sizingMethod=\'scale\');"></td>';
			sHtml += ' <td style="width:' + giShadowWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'shadow_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml += '<table cellspacing=0 cellpadding=0>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giShadowHeightTop + 'px;width:' + giShadowWidthLeft + 'px;background-image:url(' + gsDir + 'shadow_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'shadow_tc.png);background-repeat:repeat-x"></td>';
			sHtml += ' <td style="width:' + giShadowWidthRight + 'px;background-image:url(' + gsDir + 'shadow_tr.png);background-repeat:repeat-y"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;

			oLeftDiv.innerHTML = '<div style="width:' + giShadowWidthLeft + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'shadow_ml.png);background-repeat:repeat-y"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giShadowWidthRight + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'shadow_mr.png);background-repeat:repeat-y"></td>';


			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giShadowHeightBottom + 'px;width:' + giShadowWidthLeft + 'px;background-image:url(' + gsDir + 'shadow_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'shadow_bc.png);background-repeat:repeat-x"></td>';
			sHtml += ' <td style="width:' + giShadowWidthRight + 'px;background-image:url(' + gsDir + 'shadow_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}


	// ShonanRShadow ******************************************************************************
	} else if(sClass == "ShonanRShadow"){
		
		// 画像幅 + 左シャドウ + 右シャドウ - 左重なり - 右重なり;
		iAllWidth = iWidth + giRShadowWidthLeft + giRShadowWidthRight - giRShadowWidthLeftIn - giRShadowWidthRightIn;
		
		// 画像高さ + 上シャドウ + 下シャドウ - 上重なり - 下重なり;
		iAllHeight = iHeight + giRShadowHeightTop + giRShadowHeightBottom - giRShadowHeightTopIn - giRShadowHeightBottomIn;
		
		// センター幅
		iMainWidth = iWidth - giRShadowWidthLeftIn - giRShadowWidthRightIn;
		iMainHeight = iHeight - giRShadowHeightTopIn - giRShadowHeightBottomIn;


		
		sHtml = "";
		
		if(bWinIe == 1){
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giRShadowHeightTop + 'px;width:' + giRShadowWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_tl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_tc.png\', sizingMethod=\'scale\' );"></td>';
			sHtml += ' <td style="width:' + giRShadowWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;

			oLeftDiv.innerHTML = '<div style="width:' + giShadowWidthLeft + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_ml.png\', sizingMethod=\'scale\');"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giShadowWidthRight + 'px;height:' + iMainHeight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_mr.png\', sizingMethod=\'scale\');"></div>';

			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giRShadowHeightBottom + 'px;width:' + giRShadowWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_bl.png\');"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_bc.png\', sizingMethod=\'scale\');"></td>';
			sHtml += ' <td style="width:' + giRShadowWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'rshadow_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giRShadowHeightTop + 'px;width:' + giRShadowWidthLeft + 'px;background-image:url(' + gsDir + 'rshadow_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'rshadow_tc.png);background-repeat:repeat-x"></td>';
			sHtml += ' <td style="width:' + giRShadowWidthRight + 'px;background-image:url(' + gsDir + 'rshadow_tr.png);background-repeat:repeat-y"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giShadowWidthLeft + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'rshadow_ml.png);background-repeat:repeat-y"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giShadowWidthRight + 'px;height:' + iMainHeight + 'px;background-image:url(' + gsDir + 'rshadow_mr.png);background-repeat:repeat-y"></td>';

			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giRShadowHeightBottom + 'px;width:' + giRShadowWidthLeft + 'px;background-image:url(' + gsDir + 'rshadow_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + iMainWidth + 'px;background-image:url(' + gsDir + 'rshadow_bc.png);background-repeat:repeat-x"></td>';
			sHtml += ' <td style="width:' + giRShadowWidthRight + 'px;background-image:url(' + gsDir + 'rshadow_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}
		
	}


    // フォトコーナー1の場合 ********************************************************************************
	else if(sClass == "photocorner1"){
		iMainHeight = iHeight;
		iMainWidth = iWidth;
		iAllWidth = iWidth + 4;
		NegativeMarginWidth = (giPhotoCornerWidthLeft + giPhotoCornerWidthRight);
		NegativeMarginHeight = (giPhotoCornerHeightTop + giPhotoCornerHeightBottom);
		
		if(bWinIe == 1){
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightTop + 'px;width:' + giPhotoCornerWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_1_tl.png\');"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 4) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_1_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthLeft + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthRight + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></div>';
			
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightBottom + 'px;width:' + giPhotoCornerWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_1_bl.png\');"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 4) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_1_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightTop + 'px;width:' + giPhotoCornerWidthLeft + 'px;background-image:url(' + gsDir + 'photocorner_1_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 4) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;background-image:url(' + gsDir + 'photocorner_1_tr.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';

			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthLeft + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthRight + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></td>';

			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightBottom + 'px;width:' + giPhotoCornerWidthLeft + 'px;background-image:url(' + gsDir + 'photocorner_1_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 4) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;background-image:url(' + gsDir + 'photocorner_1_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}
    }


    // フォトコーナー1の場合 ********************************************************************************
	else if(sClass == "photocorner2"){
		iMainHeight = iHeight;
		iMainWidth = iWidth;
		iAllWidth = iWidth + 6;
		NegativeMarginWidth = (giPhotoCornerWidthLeft + giPhotoCornerWidthRight);
		NegativeMarginHeight = (giPhotoCornerHeightTop + giPhotoCornerHeightBottom);
		
		if(bWinIe == 1){
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightTop + 'px;width:' + giPhotoCornerWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_2_tl.png\');"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 6) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_2_tr.png\');"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';
			
			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthLeft + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></div>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthRight + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></div>';
			
			sHtml = "";
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightBottom + 'px;width:' + giPhotoCornerWidthLeft + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_2_bl.png\');"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 6) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + 'photocorner_2_br.png\')"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		} else {
			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightTop + 'px;width:' + giPhotoCornerWidthLeft + 'px;background-image:url(' + gsDir + 'photocorner_2_tl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 6) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;background-image:url(' + gsDir + 'photocorner_2_tr.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += ' </table>';

			// 出力DIVの中にHTMLを格納する
			oTopDiv.innerHTML = sHtml;
			
			oLeftDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthLeft + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></td>';
			oRightDiv.innerHTML = '<div style="width:' + giPhotoCornerWidthRight + 'px;height:' + (iMainHeight - NegativeMarginHeight) + 'px;"></td>';

			sHtml = '';
			sHtml += '<table cellspacing=0 cellpadding=0 width=' + iAllWidth + '>';
			sHtml += ' <tr>';
			sHtml += ' <td style="height:' + giPhotoCornerHeightBottom + 'px;width:' + giPhotoCornerWidthLeft + 'px;background-image:url(' + gsDir + 'photocorner_2_bl.png);background-repeat:no-repeat"></td>';
			sHtml += ' <td style="width:' + (iMainWidth - NegativeMarginWidth + 6) + 'px;"></td>';
			sHtml += ' <td style="width:' + giPhotoCornerWidthRight + 'px;background-image:url(' + gsDir + 'photocorner_2_br.png);background-repeat:no-repeat"></td>';
			sHtml += ' </tr>';
			sHtml += '</table>';
			oBottomDiv.innerHTML = sHtml;
			
		}


    }


	
	// bodyの中にオブジェクトを追加する
	document.getElementsByTagName("body")[0].appendChild(oTopDiv);
	document.getElementsByTagName("body")[0].appendChild(oBottomDiv);
	document.getElementsByTagName("body")[0].appendChild(oLeftDiv);
	document.getElementsByTagName("body")[0].appendChild(oRightDiv);
}

/******************************************************************************
	関数名		ShowAccessory
	機能		アクセサリーを表示する
	
	入力		oElement		エレメントオブジェクト
				sShonanClass	湘南クラス"ShonanCell"など
				sId				ID名
	出力		なし
	
******************************************************************************/
function ShowAccessory(oImage, sShonanClass, sId){

	var iTop = GetObjectPosition(oImage, "top");
	var iLeft = GetObjectPosition(oImage, "left") + oImage.width / 2;
	var sHtml = "";
	var oDiv = document.createElement('div');
	var iMainHeight, iMainWidth;
	var bWinIe = CheckBrowserMode();
	
	var iPhotoFrameHeight = 0;
	var iPolaFrameHeight = 0;

    var img_list = {
        'ShonanCell'      : ['cellophane.png', giCellWidth, giCellHeight],
        'ShonanPhotoCell' : ['cellophane.png', giCellWidth, giCellHeight],
        'ShonanPolaCell'  : ['cellophane.png', giCellWidth, giCellHeight],
        'maskingtape1'    : ['mt_1.png', giMtWidth, giMtHeight],
        'maskingtape2'    : ['mt_2.png', giMtWidth, giMtHeight],
        'maskingtape3'    : ['mt_3.png', giMtWidth, giMtHeight],
        'pin1'            : ['pin_1.png', giPinWidth, giPinHeight],
        'pin2'            : ['pin_2.png', giPinWidth, giPinHeight],
        'frame_maskingtape1'    : ['mt_1.png', giMtWidth, giMtHeight],
        'frame_maskingtape2'    : ['mt_2.png', giMtWidth, giMtHeight],
        'frame_maskingtape3'    : ['mt_3.png', giMtWidth, giMtHeight],
        'frame_pin1'            : ['pin_1.png', giPinWidth, giPinHeight],
        'frame_pin2'            : ['pin_2.png', giPinWidth, giPinHeight]
    }

	// ステージの外に表示する
	oDiv.id = sId;
	oDiv.style.top = "-1000px";
	oDiv.style.left = "-1000px";
	oDiv.style.position = "absolute";
	oDiv.style.zIndex = giZIndex;
	giZIndex++;

	if(bWinIe == 1){
		sHtml += '<table cellspacing=0 cellpadding=0 class="photoframe_opt">';
		sHtml += ' <tr>';
		sHtml += ' <td style="height:' + img_list[sShonanClass][2] + 'px;width:' + img_list[sShonanClass][1] + 'px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + gsDir + img_list[sShonanClass][0] + '\');"></td>';
		sHtml += ' </tr>';
		sHtml += '</table>';
	} else {
		sHtml += '<table cellspacing=0 cellpadding=0>';
		sHtml += ' <tr>';
		sHtml += ' <td style="height:' + img_list[sShonanClass][2] + 'px;width:' + img_list[sShonanClass][1] + 'px;background-image:url(' + gsDir + img_list[sShonanClass][0] + ');background-repeat:no-repeat"></td>';
		sHtml += ' </tr>';
		sHtml += '</table>';
	}
	// 出力DIVの中にテーブルを挿入する
	oDiv.innerHTML = sHtml;
	
	// bodyの中にオブジェクトを追加する
	document.getElementsByTagName("body")[0].appendChild(oDiv);
	
	// ポジションを設定する
	SetFramePosition(oImage, oDiv.id, sShonanClass);
}



/********************************************************************************
	関数名		CheckBrowserMode
	機能		AlphaImageLoader対応ブラウザかチェックする
	
	入力		なし
	出力		bMode		1:AlphaImageLoder対応ブラウザ  0:PNG対応ブラウザ
							2:Safari 3:MacIE（湘南フレーム非対応）
	
	Thanks for etsuko&gyazbee
********************************************************************************/
function CheckBrowserMode(){
	var sOs = GetOsName();
	var sBrowser = GetNavigatorName();
	var iVar = GetNavigatorVersion();
	
	// IE7未満の場合
	if(sOs == "Windows" && sBrowser == "Explorer" && iVar < 7){
		return 1;
	// Safariの場合
	} else if ( sBrowser == "Safari" && navigator.userAgent.indexOf('Chrome') < 0){
		return 2;
	// Mac IEの場合
	} else if (sOs != "Windows" && sBrowser == "Explorer"){
		return 3;
	}
	return 0;
}



function GetOsName(){
	var uAgent  = navigator.userAgent.toUpperCase();
	if (uAgent.indexOf("MAC OS X") >= 0) return "MacOSX";
	if (uAgent.indexOf("MAC") >= 0) return "MacOS";
	if (uAgent.indexOf("WIN") >= 0) return "Windows";
	if (uAgent.indexOf("X11") >= 0) return "UNIX";
	return "";
}



function GetNavigatorName(){
	if(navigator.IBM_HPR) return "HomepageReader";
	
	aName  = navigator.userAgent.toUpperCase();
	if (aName.indexOf("SAFARI") >= 0) return "Safari";
	if (aName.indexOf("CHIMERA") >= 0) return "Camino";
	
	aName = navigator.appName.toUpperCase();
	if (aName.indexOf("NETSCAPE") >= 0)  return "Netscape";
	if (aName.indexOf("MICROSOFT") >= 0) return "Explorer";
	return "";
}



function GetNavigatorVersion(){
	var browser = GetNavigatorName();
	var version = 0;
	var s = 0;
	var e = 0;
	var appVer  = navigator.appVersion;
	var userAgent = navigator.userAgent;

	if (browser == "Netscape"){
		s = appVer.indexOf(" ",0);
		version = eval(appVer.substring(0,s));
		if (version >= 5){
			version = navigator.vendorSub;
		}
	}
	if (browser == "Explorer"){
		appVer  = navigator.userAgent;
		s = appVer.indexOf("MSIE ",0) + 5;
		e = appVer.indexOf(";",s);
		version = eval(appVer.substring(s,e));
	}
	if (browser == "Safari"){
		s = appVer.indexOf("Safari/",0) + 7;
		version = appVer.slice(s);
	}
	if (browser == "Camino"){
		s = appVer.indexOf(" ",0);
		version = eval(appVer.substring(0,s));
		if (version >= 5){
			version = navigator.vendorSub;
		}
	}
	if (browser == "Opera"){
		s = userAgent.indexOf("Opera ",0) + 6;
		version = userAgent.substring(s);
	}
	if (browser == "HomepageReader"){
		return navigator.IBM_WAT_Version;
	}
	return version;
}



/******************************************************************************
	関数名		GetElementsByClass
	機能		クラス名によってエレメントを取得する
	
	入力		sClass			クラス名
	出力		aMatchElements	エレメント配列
******************************************************************************/
document.GetElementsByClass = function(sClass) {

	// クラス名のマッチするエレメントリスト
	var aAllElements = new Array;
	var iAllCnt = 0;
	// マッチエレメント
	aMatchElements = new Array;
	var aMatchElementsCnt = 0;

	// GetElementsByTagNameに対応していない場合
	if (!document.getElementsByTagName) {
		return new Array();
	}
	
	// 対象エレメントに含まれるエレメントをすべて連結する
	aAllElements = document.getElementsByTagName('img');
	
	// 全エレメントに対して繰り返す
	for (iAllCnt = 0; iAllCnt < aAllElements.length; iAllCnt++) {
		
		// クラスが存在し、対象クラスが設定されている場合
		if (aAllElements[iAllCnt].className && aAllElements[iAllCnt].className.match(new RegExp('\\b'+sClass+'\\b'))) {
			aMatchElements[aMatchElementsCnt++] = aAllElements[iAllCnt];
		}
	}
	
	return aMatchElements;
}


// 湘南フレームを実行する
// SetShonanFrameTimer(gsBackgroundClass);
//SetShonanFrameTimer(gsCornerColor);





